/*=.=.=.=.=---STYLE FOR---=.=.=.=.=*/

/* Getting the new tags to behave */
article, aside, audio, 
canvas, command, 
datalist, details, 
embed, 
figcaption, figure, footer, 
header, hgroup, 
keygen, 
meter, 
nav, 
output, 
progress, 
section, source, 
video {
	display:block;
}
mark, 
rp, rt, ruby, 
summary, 
time {
	display:inline;
}


*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

img { max-width: 100%; border: none;}

@font-face {
    font-family: 'RalewayRegular';
    src: url('../fonts/raleway-regular.eot');
    src: url('../fonts/raleway-regular.eot') format('embedded-opentype'),
         url('../fonts/raleway-regular.woff2') format('woff2'),
         url('../fonts/raleway-regular.woff') format('woff'),
         url('../fonts/raleway-regular.ttf') format('truetype'),
         url('../fonts/raleway-regular.svg#RalewayRegular') format('svg');
}


@font-face {
    font-family: 'CalibriRegular';
    src: url('../fonts/calibri.eot');
    src: url('../fonts/calibri.eot') format('embedded-opentype'),
         url('../fonts/calibri.woff') format('woff'),
         url('../fonts/calibri.ttf') format('truetype'),
         url('../fonts/calibri.svg#CalibriRegular') format('svg');
}




/* Global properties */
*{ padding:0px; margin:0px; outline:none; border:none; list-style:none; text-decoration:none; }
.noBdr{ border:none !important; }
.clr{ line-height:0px; font-size:0px; clear:both; }

body{ font:normal 14px/18px Arial, Helvetica, sans-serif; color:#000; background: url(../images/bdy-bg.jpg) top center no-repeat #2f1b19;}
.container { width: 1000px; margin: 0 auto;}

.btn { width: auto; float: left; line-height: 31px; padding: 0 18px; font-family: "Georgia", Arial; background: #dd127b; font-size: 12px; color: #fff;}
.btn:hover { background: #339533;}
.hdn { width: 100%; display: inline-block; padding-bottom: 10px;}
.hdn h2 { font: 30px "RalewayRegular", Arial; color: #696969;}
.hdn h2 span { color: #dd127b;}


/*===============-------------- Custome ---------------===============*/

.top-hdr { width: 100%; float: right; background: #222;}
.top-hdr ul { width: auto; float: right;}
.top-hdr ul li { width: auto; float: left; background: url(../images/top-nav-sap.jpg) right center no-repeat;}
.top-hdr ul li a { font: 13px/34px 'Open Sans', sans-serif; color: #bfbfbf; display: block; padding: 0 13px;}
.top-hdr ul li a:hover { color: #fff;}
.top-hdr ul li:last-child { background: none;}
.top-hdr ul li:last-child a { padding-right: 0;}


.lgo-area { width: 100%; float: left; padding-top: 10px;}
.logo { width: auto; float: left;}
.logo a, .logo a img { display: block;}

.acunt-sec { width: auto; float: right; padding-top: 14px;}
.fb-cnt { width: auto; float: right; padding-bottom: 14px;}
.fb-cnt a{ display: inline-block;}
.fb-cnt a:first-child { margin-right: 20px;}
.fb-cnt img { display: block;}
.lgn, .lgn ul { width: auto; float: right;}
.lgn ul li { width: auto; float: left;  min-width: 144px; padding-right: 26px;}
.lgn ul li:last-child { padding-right: 0;}
.lgn ul li:last-child a { background: #dd127b;}
.lgn ul li a { display: block; font: italic 18px/33px "CalibriRegular", Arial; padding: 0 27px;  text-align: center; color: #fff;}
.lgn ul li:first-child a { background: #009900;}



.nav { width: 100%; float: left; background: url(../images/nav-bg.jpg) 0 0 repeat-x; border-bottom: #ff3099 1px solid; border-top: #ff3099 1px solid;}
.nav ul { width: 100%; float: left; background: url(../images/nav-li-bg.jpg) right center no-repeat;}
.nav ul li { width: auto; float: left; background: url(../images/nav-li-bg.jpg) right center no-repeat;}
.nav ul li a { font: 600 16px/43px "Open Sans", Arial; color: #fff; text-transform: uppercase; padding: 0 43px; display: block;}
.nav ul li:first-child a { background: url(../images/nav-li-bg.jpg) left center no-repeat;} 
.nav ul li:last-child { background: none;}
.nav ul li a:hover { color: #47001f;}
.desk-mnu { display: block;}
.tri { display: none;}
.mob-mnu { display: none;}



/*=====================------------------ Banner -----------------------======================*/
.banner { width: 100%; float: left; margin: 35px 0 100px 0; background: #fff; padding: 0.5em;}
.flexslider {width: 100%; margin: 0; padding: 0;}
.flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block; }
.flex-pauseplay span {text-transform: capitalize;}
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}
.no-js .slides > li:first-child {display: block;}
.flexslider {position: relative; zoom: 1;}
.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
.flex-container {zoom: 1; position: relative;}

/* Direction Nav */
.flex-direction-nav li a {width:45px; height:42px; margin:0; display: none; position: absolute; right:11px; cursor: pointer; text-indent: -9999px;}


/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; height:34px; bottom: -41px; text-align: center; background: url(../images/ban-nav-bg.png) top center no-repeat; padding-top: 10px;}
.flex-control-nav li {margin: 0 0 0 8px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 14px; height: 14px; display: block; cursor: pointer; text-indent: -9999px; background: #4f4f4f; -webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;}
.flex-control-nav li a:hover {background: #c10749;}
.flex-control-nav li a.active {background: #c10749;}


.flex-caption { width: 429px; height: 100%; position: absolute; right: 0; top:0; background: url(../images/bnr-txt-bg.png) 0 0 no-repeat; background-size: 100% 100%; padding:10px 1em 0 103px;}
.caption_title_line { width: 100%; float: left; text-align: center;}
.caption_title_line h2 { font: italic 700 18px/22px "Open Sans", Arial; color: #fff; padding-bottom: 10px;}
.caption_title_line p { font: italic 14px/16px "CalibriRegular", Arial; color: #efefef; padding-bottom: 18px;}
.caption_title_line a { display: inline-block; background: #007a00; font: italic 16px/42px "Georgia", Arial; color: #ffffff; padding: 0 18px;}




.project-br { width: 100%; float: left; background: url(../images/pro-bg.png) left top repeat-x #fff; border: #f0efef 1px solid; border-bottom: #dd127b 3px solid;}
.pro-cil { width: 33.3333%; float: left; padding: 0 1.8em; background: url(../images/sep-pro.jpg) right center no-repeat; text-align: center; }
.pro-cil:last-child { background: none;}
.pro-img { width: 100%; float: left; text-align: center; margin-top: -39px;}
.pro-img-rap { display: inline-block; text-align: center; overflow: hidden; width: 166px; height: 166px; -webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%; border: #18d8e9 3px solid; box-shadow: 4px 4px 4px #c8c8c8; -o-box-shadow: 4px 4px 4px #c8c8c8; -moz-box-shadow: 4px 4px 4px #c8c8c8; -webkit-box-shadow: 4px 4px 4px #c8c8c8;}
.pro-img-rap img { width: 100%; height: 100%; -webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;}
.pro-txt { width: 100%; float: left; text-align: center; padding-top: 10px; height: 150px;}
.pro-txt h2 { font: 20px "RalewayRegular", Arial; color: #535353; padding-bottom: 7px;}
.pro-txt p { font: 12px/18px "Georgia", Arial; color: #585858; padding-bottom: 17px;}
.pro-cil .btn { display: inline-block; float: none;}


.hmitxt { width: 100%; float: left; background: url(../images/pro-bg.png) left top repeat-x #fff; border: #f0efef 1px solid; margin-top: 17px; padding: 1.8em;}
.hmitxt p { color: #585858; font-size: 15px; line-height: 20px; padding-bottom: 18px; width:100%; float: left;}
.hlf { width: 50%; float: left; background: url(../images/sep-pro.jpg) right top no-repeat;}
.hlf:last-child { background: none;}
.pad-rht { padding-right: 1.8em;}
.pad-lft { padding-left: 1.8em;}
.hlf .hdn { padding-bottom: 0;}
.hlf p {padding-top: 10px;}
.hlf p span { color: #dd127b;}
.hlf p strong { font-family: "Georgia", Arial; color: #DF1279;}
.membr-dtl { display: inline-block; width: 100%;}
.membr-dtl ul { width: 100%; float: left;}
.membr-dtl ul li { width: 100%; float: left; font-family: "Georgia", Arial; font-size: 13px; color: #414141; padding-bottom: 5px;}
.membr-dtl ul li span { color: #DF1279;}



/*===========------------------ Footer css start ----------------===========*/

.footer-rap { width: 100%; float: left; padding: 1.8em; margin-top: 17px;  background: url(../images/pro-bg.png) left top repeat-x #fff; border: #fff 1px solid; position: relative; z-index: 99;}
.ftr-col { width: 33.3333%; float: left; background: url(../images/ftr-sep.jpg) right center no-repeat;}
.ftr-col-inr { width: 100%; float: left; }
.ftr-col:nth-child(3) { background: none;}
.ftr-col:nth-child(2) .ftr-col-inr ul { padding: 0 0 0 58px}
.ftr-col:nth-child(3) .ftr-col-inr ul { padding: 0 0 0 90px;} 
.ftr-col-inr ul { width: 100%; float: left;}
.ftr-col-inr ul li { width: 100%; float: left; padding-bottom: 10px; padding-left: 25px; background: url(../images/ftr-list.png) 0 0 no-repeat;}
.ftr-col-inr ul li a { font-family: "Georgia", Arial; color: #464646; font-size: 11px; text-align: left;}
.ftr-col-inr ul li a:hover { color: #D70F6F;}


.footer-imn { width: 100%; float: left; padding-top: 60px; margin-top: -29px; text-align: center; font-family:  "Open Sans", Arial; background: #171717;}
.ftr-nav { width: 100%; float: left; padding-bottom: 8px;}
.ftr-nav ul{ display: inline-block;}
.ftr-nav ul li { padding: 0 17px; background: url(../images/ftr-nav-sep.png) right center no-repeat; width: auto; float: left;}
.ftr-nav ul li:last-child { background: none;}
.ftr-nav ul li a { font-size: 15px; color: #c7c7c7;}
.ftr-txt a { font-size: 13px;color: #c7c7c7; padding: 0 5px;}
.ftr-txt p { font-size: 13px; color: #c7c7c7; padding: 8px 0 35px 0;}

/*---------------------about page-----------------------*/
.achieve_listing {width:100%; float: left;}
.achieve_listing h2 {font-family: Arial; font-size: 17px; color:#dd127b; font-weight: 400; padding-bottom: 16px;}
.achieve_listing ul {width:100%; float: left; margin: 0; padding: 0;}
.achieve_listing ul li {list-style: none; margin: 0; padding: 0 25px 8px;  background: url(../images/achieve-listing-bg.png) no-repeat 0 2px;  color: #585858;font-size: 15px;line-height: 20px;}
.greenbox {width:100%; float:left; padding: 25px 32px 21px; background: url(../images/greenbox-bg.jpg) repeat-x 0 0; margin-top: 25px; background-size: 100% 100%; margin-bottom: 20px;}
.greenbox p {font-family: Arial; font-size: 14px; color:#d9d9d9; font-weight: 400; padding-bottom: 15px;}
.greenbox p span {color:#ffff00; display: inline-block;padding-right: 5px;}
.greybox {width:100%; float:left; padding: 25px 32px 21px; background: url(../images/greybox-bg.jpg) repeat-x 0 0; margin-top: 25px; background-size: 100% 100%; margin-bottom: 20px; border:1px solid #c8c8c8;}
.hdn p {font-family: Arial; font-size: 14px; color:#585858; font-weight: 400; padding-bottom: 0 !important;}
.hdn p span {color:#dd127b; display: inline-block;padding-right: 5px;}
.hlf.grb {background: url(../images/greybox-separator.jpg) left top no-repeat;}
.charimons {width:100%; float: left; border-top: 1px dashed #9e9e9e; padding: 20px 0 0; margin-top: 32px;}
.hdn.hdnforch h2 {padding-bottom: 24px;}
.hdn.hdnforch a {margin-top: 24px;}

.hm_inner h3 {color: #781E16;font-family: Arial; font-size: 17px;font-weight: 400; padding-bottom: 16px;}
.hm_inner {width:100%; float: left;}
.hm_inner p {color:#0b570b;   font-size: 15px;line-height: 20px;padding-bottom: 9px;}
.hm_inner p span {color:#dd127b;}
.hmitxt h3 {
	color: #585858;
	font-family: Arial;
	font-size: 17px;
	font-weight: 400;
	padding-bottom: 16px;
}

.award {width:100%; float: left; margin-bottom: 20px;}
.award img {width:100%; display:block;}
.annual_listing {width:100%; float: left;}
.annual_listing ul {width:100%; float: left; margin: 0; padding: 0;}
.annual_listing ul li {margin: 0; padding: 0 20px 7px; list-style: none; font-family: Arial; font-size: 14px; color:#000; font-weight: 400; background: url(../images/annual_listing_bg.png) no-repeat 0 5px;}
.hmitxt p span {font-weight: 700;}
.govornors_panel {width:100%; float:left;}
.govornorbox {width:41%; float:left; background: #fff; border:1px solid #eee; padding: 7px; margin: 0 42px 23px;}
.govornorbox img {width:100%; display: block; padding-bottom: 9px;}
.govornorbox p {color:#000;   font-size: 15px;line-height: 20px; text-align:center;padding-bottom: 0;}
.officialbox {width:24%; float:left; background: #fff; border:1px solid #eee; padding: 7px; margin: 0 42px 23px; min-height: 359px;}
.officialbox img {width:100%; display: block; padding-bottom: 9px;}
.officialbox p {color:#000;   font-size: 15px;line-height: 20px; text-align:center;padding-bottom: 0;}


.form_box {width:100%; float:left; padding-top: 58px;}
.order_text {width:100%; float: left; margin-bottom: 25px; font-family: 'Open Sans', sans-serif; font-weight: 400; color:#000;}
.order_text label {width:27%; float: left; font-size: 14px; font-family: 'Open Sans', sans-serif; font-weight: 400; color:#000;}
.order_text input[type="text"] {width:70%; float: left; background-color: #ffffff; box-shadow: 2px 2px 2px 0 #a8a8a8 inset; height: 29px; padding: 5px 7px; border: 1px solid #E8127B;}
.order_text input[type="radio"] { margin-right: 6px;}
.order_text input.gfm[type="radio"] {margin-left: 29px;}
.styled-select {background: url(../images/select-icon.png) no-repeat scroll 97% 12px #fff; height: 29px;overflow: hidden;width: 70%; box-shadow: 2px 2px 2px 0 #a8a8a8 inset;}
.styled-select select {background: none repeat scroll 0 0 transparent;border: 0 none;font-size: 11px;height: 34px;line-height: 1;padding: 5px;width: 542px;}
.styled-select.ss_for_dob {float: left; margin-right: 15px; width: 22%; border: 1px solid #E8127B;}
.styled-select.ss_for_dob select {width:225px;}
.order_text label.fru {text-decoration: underline; width: 100%;}
.styled-select.ss_for_dob.ipn {background: none;}
.order_submit {width:auto; float: left;margin-left: 258px;}
.order_submit input[type="submit"]{color: #fff;font-family: Arial; font-size: 17px;font-weight: 400; padding: 6px 20px; background: #E8127B; cursor: pointer;}
.styled-select.ss_for_dob.ipn input[type="text"]{border:none;}
.message_box textarea {width:100%; background: #fff; border: 1px solid #E8127B;box-shadow: 2px 2px 2px 0 #a8a8a8 inset; height: 129px; padding: 5px 7px;}
.message_box {width:100%; float: left; margin-top: 10px;}
.message_submit {width:auto; float: none; margin-top: 10px;}
.message_submit input[type="submit"]{color: #fff;font-family: Arial; font-size: 17px;font-weight: 400; padding: 6px 20px; background: #E8127B; cursor: pointer;}
.lst_text {width:45%; float: left; margin-right: 20px;}
.lst_text label {color:#000;   font-size: 15px;line-height: 26px; width:12%;}
.lst_text input[type="text"]{width:74%; float: right; background-color: #ffffff; box-shadow: 2px 2px 2px 0 #a8a8a8 inset; height: 29px; padding: 5px 7px; border: 1px solid #E8127B;}
.lst_form_panel {width:100%; float: left; margin-bottom: 16px;}
.for_sig {width:30%; float: left;}
.submit_for_all {width:100%; float: left; text-align: center;}
.for_sig input[type="text"]{width:100%; background: none; border-bottom: 1px dotted #E8127B; padding: 0 7px;color: #000;font-family: Arial; font-size: 15px;}
.order_text textarea {width:70%; float: left; background-color: #ffffff; box-shadow: 2px 2px 2px 0 #a8a8a8 inset; height: 129px; padding: 5px 7px; border: 1px solid #E8127B;}

.slide_caption {width:100%; float: left; background: #D81070; padding: 30px;}
.slide_caption img {width:auto; float:left; margin-right: 20px; min-height: 215px;}
.slide_caption h2 {color: #781E16;font-family: Arial; font-size: 17px;font-weight: 400; padding-bottom: 16px;}
.slide_caption p {color: #fff;font-family: Arial; font-size: 17px;font-weight: 400; width: auto;}
.flex_for_gal .flex-control-nav {background: none;}
.flex_for_gal {margin-bottom: 20px;}
.flex_for_gal .flex-control-nav li a {width:7px; height: 9px;}










.ftr-txt { width: 100%; float: left; font-size: 15px; color:#c7c7c7; }
.textfield {
	font-weight: bolder;
	text-align: left;
}
.aste {
	font-weight: bold;
	color: #CC3333;
}
.longtxtfld {
	width: 250px;
}


/* SpryValidationTextField.css - version 0.4 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */


/* These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */ 
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg {
	display: none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textfieldRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	display: inline;
	color: #CC3333;
	border: 1px none #CC3333;
}



/* The next three group selectors control the way the core element (INPUT) looks like when the widget is in one of the states: * focus, required / invalid / minValue / maxValue / minChars / maxChars , valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the INPUT
 * - the widget id is placed on the INPUT element itself (there are no error messages)
 */
 
 /* When the widget is in the valid state the INPUT has a green background applied on it. */
.textfieldValidState input, input.textfieldValidState {
	background-color: #B8F5B1;
}

/* When the widget is in an invalid state the INPUT has a red background applied on it. */
input.textfieldRequiredState, .textfieldRequiredState input, 
input.textfieldInvalidFormatState, .textfieldInvalidFormatState input, 
input.textfieldMinValueState, .textfieldMinValueState input, 
input.textfieldMaxValueState, .textfieldMaxValueState input, 
input.textfieldMinCharsState, .textfieldMinCharsState input, 
input.textfieldMaxCharsState, .textfieldMaxCharsState input {
	background-color: #FF9F9F;
}

/* When the widget has received focus, the INPUT has a yellow background applied on it. */
.textfieldFocusState input, input.textfieldFocusState {
	background-color: #FFFFCC;
}

/* This class applies only for a short period of time and changes the way the text in the textbox looks like.
 * It applies only when the widget has character masking enabled and the user tries to type in an invalid character.
 */
.textfieldFlashText input, input.textfieldFlashText {
	color: red !important;
}

/* When the widget has the hint message on, the hint text can be styled differently than the user typed text. */
.textfieldHintState input, input.textfieldHintState {
	/*color: red !important;*/
}


/* SpryValidationRadio.css - version 0.1 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2007. Adobe Systems Incorporated. All rights reserved. */


/* These are the classes applied on the messages
 * (required message and invalid value message )
 * which prevent them from being displayed by default.
 */
.radioRequiredMsg, .radioInvalidMsg{
	display: none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and font color for the error text.
 * The state class (e.g. .radioRequiredState) is applied on the top-level container for the widget, 
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.radioRequiredState .radioRequiredMsg,
.radioInvalidState .radioInvalidMsg{
	display: inline;
	color: #CC3333;
	border: 1px solid #CC3333;
}


/* SpryFormValidation.css - version 0.5 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */



/* These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */ 
.textareaRequiredMsg,
.textareaMinCharsMsg,
.textareaMaxCharsMsg,
.textareaValidMsg {
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textareaRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textareaRequiredState .textareaRequiredMsg,
.textareaMinCharsState .textareaMinCharsMsg,
.textareaMaxCharsState .textareaMaxCharsMsg
{
	display: inline;
	color: #CC3333;
	border: 1px solid #CC3333;
}

/* The next three group selectors control the way the core element (TEXTAREA) looks like when the widget is in one of the states: * focus, required / minChars / maxChars , valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the TEXTAREA
 * - the widget id is placed on the TEXTAREA element itself (there are no error messages)
 */
 
 /* When the widget is in the valid state the TEXTAREA has a green background applied on it. */
.textareaValidState textarea, textarea.textareaValidState {
	background-color:#B8F5B1;
}

/* When the widget is in an invalid state the TEXTAREA has a red background applied on it. */
textarea.textareaRequiredState, .textareaRequiredState textarea, 
textarea.textareaMinCharsState, .textareaMinCharsState textarea, 
textarea.textareaMaxCharsState, .textareaMaxCharsState textarea {
	background-color:#FF9F9F;
}

/* When the widget has received focus, the TEXTAREA has a yellow background applied on it. */
.textareaFocusState textarea, textarea.textareaFocusState {
	background-color:#FFFFCC;
}

/* This class applies only for a short period of time and changes the way the text in the textarea looks like.
 * It applies only when the widget has enforce max chars enabled and the user tries to type some more.
 */
.textareaFlashState textarea, textarea.textareaFlashState{
	color:red !important;
}
/* When the widget has the hint message on, the hint text can be styled differently than the user typed text. */
textarea.textareaHintState, .textareaHintState textarea{
	/* color: red !important;*/
}


/* SpryValidationSelect.css - version 0.4 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* These are the classes applied on the messages
 * (required message and invalid state message)
 * which prevent them from being displayed by default.
 */ 
.selectRequiredMsg, .selectInvalidMsg {
	display: none;
}

/* These selectors change the way messages look when the widget is in one of the error states (required, invalid).
 * These classes set a default red border and color for the error text.
 * The state class (.selectRequiredState or .selectInvalidState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.selectRequiredState .selectRequiredMsg,
.selectInvalidState .selectInvalidMsg {
	display: inline;
	color: #CC3333;
	border: 1px solid #CC3333;
}

/* The next three group selectors control the way the core element (SELECT) looks like when the widget is in one of the states: 
 * focus, required / invalid, valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the SELECT
 * - the widget id is placed on the SELECT element itself (there are no error messages)
 */
 
/* When the widget is in the valid state the SELECT has a green background applied on it. */
.selectValidState select, select.selectValidState {
	background-color: #B8F5B1;
}

/* When the widget is in an invalid state the SELECT has a red background applied on it. */
select.selectRequiredState, .selectRequiredState select,
select.selectInvalidState, .selectInvalidState select {
	background-color: #FF9F9F;
}

/* When the widget has received focus, the SELECT has a yellow background applied on it. */
.selectFocusState select, select.selectFocusState {
	background-color: #FFFFCC;
}
.txtfldborder {
	border: 0.1px solid #CCC;
	width: 250px;
}
