@charset "utf-8";
/* CSS Document */
/*------------------------------- Main Frame Work Begin---------------------------------*/

body {
	background-color: #90b3b2;
}

#Wrap {
	width: 902px;
	margin: 0 auto;
}
#Maindiv {
	position: absolute;
	height: 769px;
	width: 902px;
	
	}

#Header {
	position: absolute;
	height: 199px;
	width: 902px;
	top: 0px;
	left: 0px;
	background-image: url(../images/Header.jpg);
}

#Main {
	position: absolute;
	height: 447px;
	width: 655px;
	top: 199px;
	left: 247px;
	background-image: url(../images/Main.jpg);
}

#NavDiv {
	position: absolute;
	height: 447px;
	width: 247px;
	top: 199px;
	left: 0px;
	background-image: url(../images/Navigation.jpg);
}

#Footer {
	position: absolute;
	height: 123px;
	width: 902px;
	top: 646px;
	left: 0px;
	background-image: url(../images/Footer.jpg);
}

#FooterText {
	position: absolute;
	height: 30px;
	width: 760px;
	top: 5px;
	left: 140px;
	font-size: 10px;
	font-family: Verdana, Geneva, sans-serif;
	color: #030808;
}

a:link {
	text-decoration: none;
	color: #81dbe3;
}
a:visited {
	text-decoration: none;
	color: #81dbe3;
}
a:hover {
	text-decoration: none;
	color: #ebe5e2;
}
a:active {
	text-decoration: none;
	color: #81dbe3;
}



/*------------------------------- Main Frame Work End---------------------------------*/




/*------------------------------- Navigation Buttons Begin ----------------------------*/

#HomeNav {
	position: absolute;
	height: 19px;
	width: 72px;
	top: 77px;
	left: 98px;
}

#AboutNav {
	position: absolute;
	height: 19px;
	width: 136px;
	top: 106px;
	left: 98px;
}

#ServicesNav {
	position: absolute;
	height: 19px;
	width: 127px;
	top: 135px;
	left: 98px;
}

#TestNav {
	position: absolute;
	height: 19px;
	width: 104px;
	top: 165px;
	left: 98px;
}

#FAQNav {
	position: absolute;
	height: 19px;
	width: 50px;
	top: 197px;
	left: 98px;
}

#ContactNav {
	position: absolute;
	height: 19px;
	width: 71px;
	top: 223px;
	left: 98px;
}

/*------------------------------- Navigation Buttons End ----------------------------*/


/*------------------------------- Common ids' and classes for all Pages Begin ----------------------*/
.TextAreaForAll {
	position: absolute;
	width: 533px;
	height: 360px;
	top: 66px;
	left: 17px;
}

#Scroller1 {
	position: absolute;
	overflow: hidden;
	width: 533px;
	height: 360px;
	top: 0px;
	left: 0px;
}


.ScrollerContainer {
	position: absolute;
	top: 0px;
	left: 0px;

}


.Scrollbar-Up {
	cursor: pointer;
	position: absolute;
	top: 0px;
	left: 533px;
}

.Scrollbar-Down {
	cursor: pointer;
	position: absolute;
	top: 338px;
	left: 533px;
}

#TextAreaForAll {
	position: absolute;
	height: 355px;
	width: 533px;
	top: 66px;
	left: 17px;
	overflow: auto;
	padding: 6px;
}

.TextForAll {
	font-size: 13px;
	font-family: Verdana, Geneva, sans-serif;
	color: #030808;
}

/*------------------------------- Common ids' and classes for all Pages End ----------------------*/

/*------------------------------- Testimonials Begin ----------------------------*/

#TestTitle {
	position: absolute;
	height: 42px;
	width: 229px;
	top: 19px;
	left: 155px;
	background-image: url(../images/TestimonialPageTitle.png);
}


/*------------------------------- Testimonials End ----------------------------*/


/*------------------------------- Meet The Trainer Begin ----------------------------*/

#TitleMTT {
	position: absolute;
	height: 42px;
	width: 296px;
	top: 19px;
	left: 132px;
	background-image: url(../images/MeetTheTrainerPageTitle.png);

}

/*------------------------------- Meet The Trainer End ----------------------------*/

/*------------------------------- HomePage Begin ----------------------------*/

#HomePageDiv {
	position: absolute;
	height: 445px;
	width: 570px;
	top: 0px;
	left: 0px;
	background-image:url(../images/HomePageInfo.jpg) ;
}

#HomePageText {
	position: absolute;
	height: 303px;
	width: 243px;
	top: 123px;
	left: 310px;
	overflow: auto;
	padding: 4px;
}


/*------------------------------- HomePage End ----------------------------*/


/*------------------------------- Services Begin ----------------------------*/

#ServicesTitle {
	position: absolute;
	height: 42px;
	width: 151px;
	top: 19px;
	left: 182px;
	background-image: url(../images/ServicesPageTitle.png);
	

}



/*------------------------------- Services End ----------------------------*/


/*------------------------------- FAQ Begin ----------------------------*/

#FAQTitle {
	position: absolute;
	height: 46px;
	width: 450px;
	top: 19px;
	left: 60px;
	background-image: url(../images/FAQPageTitle.png);
	

}



/*------------------------------- FAQ End ----------------------------*/


/*------------------------------- Contact Begin ----------------------------*/


#ConBG {
	position: absolute;
	height: 331px;
	width: 505px;
	top: 11px;
	left: 14px;
	background-image:url(../images/ContactBackground.jpg);
}

#ConText {
	position: absolute;
	height: 266px;
	width: 413px;
	top: 27px;
	left: 46px;
}

#ContactTitle {
	position: absolute;
	height: 42px;
	width: 151px;
	top: 19px;
	left: 210px;
	background-image: url(../images/ContactPageTitle.png);
	

}
/*------------------------------- Contact End ----------------------------*/

/* SpryFormValidation.css - Revision: Spry Preview Release 1.4 */

/* 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 solid #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;
}
.textstuff {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #212952;
}
.textstuffcheckboxes {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #212952;
}
.style2 {color: #990000}
.style4 {color: #990033}
body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	color: #3399FF;
}


/* SpryFormValidation.css - Revision: Spry Preview Release 1.4 */

/* 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;
}