/* General Body stuff */

html, body {
height: 100%;
width: 100%;
margin-top:0px;
margin-left:5px;
background:#ffffff url(/images/background/blue_fill.jpg) repeat-x; 
font-family: Arial, Helvetica, sans-serif;
font-size:1em;
}
#footer {
font-size: 0.8em;
color:#333333;
padding-bottom: 20px;
text-align: center;
}
#home_sub {
margin-bottom: 25px;
}
#header_text{
display:block;
margin: 10px 0 20px 0;
font-size:1.3em;
font-weight:bold;
color:#003399;
}
.subheading {
display:block;
font-weight:bold;
color: #003399;
margin-bottom: 5px;
}
.text {
display:block;
color:#666666;
margin-bottom: 20px;
text-align:justify;
font-size: 0.9em;
}
#signup {
display:block;
margin-top:5px;
margin-bottom:5px;
font-weight:bold;
color: #003399;
}
#signup_referral{
display:block;
margin-top:5px;
color: #333333;
font-size:0.8em;
text-align:center;
}
#referral {
width:250px;
height:140px;
color:#333333;
padding-left:25px;
padding-top:15px;
background:url(/images/postit_referral.gif) top left no-repeat;
}
#referral span {
display:block;
margin-bottom:5px;
font-size:0.9em;
}
a {
color: #003399;
text-decoration:underline;
}
a:hover {
color: #ff0000;
text-decoration:underline;
}
/* Forms */
#form_login {
height: 45px;
font-size: 0.8em;
background-color: #062271;
color: #ffffff;
}
#form_login a{
color: #ffffff;
}
#form_login a:hover{
color: #ff0000;
}
#form_login a:visited{
}
#form_signup {
font-size: 0.8em;
}
.signup_button{
font-size:2em;
}
/* Graphical Container */
#conainter_top_left {
background:url(/images/background/left_corner_top.gif) no-repeat;
width: 40px;
height: 40px;
}
#conainter_top_right {
background:url(/images/background/right_corner_top.gif) no-repeat;
width: 40px;
height: 40px;
}
#conainter_bottom_left {
background:url(/images/background/left_corner_bottom.gif) no-repeat;
width: 40px;
height: 40px;
}
#conainter_bottom_right {
background:url(/images/background/right_corner_bottom.gif) no-repeat;
width: 40px;
height: 40px;
}
#conainter_left_fill {
background:url(/images/background/left_fill.gif) repeat-y;
width: 40px;
}
#conainter_right_fill {
background:url(/images/background/right_fill.gif) repeat-y;
width: 40px;
}
#conainter_top_fill {
background:url(/images/background/top_fill.gif) repeat-x;
height: 40px;
}
#conainter_bottom_fill {
background:url(/images/background/bottom_fill.gif) repeat-x;
height: 40px;
}
.notrans {
background-color: #ffffff;
}
/* Main Nav */
#home_nav a{
text-decoration:none;
color: #ffffff;
}
#home_nav a:hover{
text-decoration:none;
color: #ff0000;
}
#home_nav a:visited{
text-decoration:none;
}
/* FAQ */
.faq {
display:block;
color: #003399;
margin-bottom: 5px;
}
.faq_subheading {
display:block;
font-weight:bold;
color: #003399;
margin-bottom: 5px;
}
.faq_text {
display:block;
color:#666666;
text-align:justify;
font-size: 0.9em;
margin-bottom: 20px;
}
a.faq_bookmark{
text-decoration:none;
}
a:hover.faq_bookmark{
text-decoration:none;
color: #003399;
}
a:visited.faq_bookmark{
text-decoration:none;
}
/*live validation*/
.LV_validation_message{
margin-left:5px;
}
.LV_valid {
color:#00CC00;
}
.LV_invalid {
color:#CC0000;
}

/* THE SPEECH BUBBLE */

.triangle-border {
	position:relative;
	padding:15px;
	margin:0 0 2em;
	border:5px solid #cccccc;
	color:#333;
	background:#fff;
	/* css3 */
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

/* Variant : for left positioned triangle
------------------------------------------ */

.triangle-border.left {
	margin-left:30px;
}

/* Variant : for right positioned triangle
------------------------------------------ */

.triangle-border.right {
	margin-right:30px;
}

/* THE TRIANGLE
------------------------------------------------------------------------------------------------------------------------------- */

.triangle-border:before {
	content:"";
	position:absolute;
	bottom:-20px; /* value = - border-top-width - border-bottom-width */
	left:600px; /* controls horizontal position */
    border-width:20px 20px 0;
	border-style:solid;
    border-color:#cccccc transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* creates the smaller  triangle */
.triangle-border:after {
	content:"";
	position:absolute;
	bottom:-13px; /* value = - border-top-width - border-bottom-width */
	left:607px; /* value = (:before left) + (:before border-left) - (:after border-left) */
	border-width:13px 13px 0;
	border-style:solid;
	border-color:#fff transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* Variant : top
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.top:before {
	top:-20px; /* value = - border-top-width - border-bottom-width */
	bottom:auto;
	left:auto;
	right:40px; /* controls horizontal position */
    border-width:0 20px 20px;
}

/* creates the smaller  triangle */
.triangle-border.top:after {
	top:-13px; /* value = - border-top-width - border-bottom-width */
	bottom:auto;
	left:auto;
	right:47px; /* value = (:before right) + (:before border-right) - (:after border-right) */
    border-width:0 13px 13px;
}

/* Variant : left
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.left:before {
	top:10px; /* controls vertical position */
	bottom:auto;
	left:-30px; /* value = - border-left-width - border-right-width */
	border-width:15px 30px 15px 0;
	border-color:transparent #5a8f00;
}

/* creates the smaller  triangle */
.triangle-border.left:after {
	top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
	bottom:auto;
	left:-21px; /* value = - border-left-width - border-right-width */
	border-width:9px 21px 9px 0;
	border-color:transparent #fff;
}

/* Variant : right
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.right:before {
	top:10px; /* controls vertical position */
	bottom:auto;
    left:auto;
	right:-30px; /* value = - border-left-width - border-right-width */
	border-width:15px 0 15px 30px;
	border-color:transparent #5a8f00;
}

/* creates the smaller  triangle */
.triangle-border.right:after {
	top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
	bottom:auto;
    left:auto;
	right:-21px; /* value = - border-left-width - border-right-width */
	border-width:9px 0 9px 21px;
	border-color:transparent #fff;
}

