@import url("gfx/MasterFloatRESETv12.css"); /* Upload stylesheet to GFX folder */
@import url("gfx/960_24_col.css"); /* Upload stylesheet to GFX folder */

/* 1.ROOT */

body {
	margin: 0;
	color: #000;
	font : 100%/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: #fff;
	
	}
	body#mysite { 
		/* Set background image POSITION and REPEAT here! */
		}
		


/* 2.HEADINGS */

h1, h2, h3, h4, h5, h6 {
font-weight: bold;
text-transform: uppercase;
font-family: Georgia, "Times New Roman", Times, serif;
color: #0a1e3f;
}

h1 {
  font-size: 3em;
  font-weight: lighter;
  line-height: 1.2;
}

h2 {
  font-size: 2em;
  font-weight: lighter;
  line-height: 1.2;
  margin-bottom: 0.75em;
}

h3 { 
	margin-bottom : 1em;
	font-size : 1em; /* 24 / 16 = 1.5 */
	line-height : 1.3; 
	}

h4 { 
	margin-bottom : 1.25em;
	font-size : 1.25em; /* 20 / 16 = 1.25 */
	line-height : 1.25; 
	}

h5 { 
	margin-bottom : 1.5em;
	font-size : 1em; /* 16 / 16 = 1 */ 
	}

h6 { 
	font-size : 1em; /* 16 / 16 = 1 */ 
	}

/* 3.TYPOGRAPHY */

p, 
ol, 
ul, 
dl, 
address { 
	margin-bottom : 1.5em; 
	font-size : 1em; /* 16 / 16 = 1 */ 
	}

ul, 
ol { 
	margin : 0 0 1.5em 24px; 
	padding-left : 24px; 
	list-style-position: outside;
	}

ul { 
	list-style-type : disc; 
	}

ol { 
	list-style-type : decimal; 
	}

ul li , 
ol li  { 
	margin : 0;
	font-size : 1em; /* 16 / 16 = 1 */ 
	}

dl, 
dd { 
	margin-bottom : 1.5em;
	}

dt { 
	font-weight : normal; 
	}

blockquote  { 
	margin : 0 0 1.5em 24px; 
	padding-left : 24px; 
	border-left : 1px solid rgb(200,200,200); /* hex code can be used here too */
	font-style : italic; 
	}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {
	content : '';
	content : none; 
	}

b, 
strong	{ 
	font-weight : bold; 
	}

i, 
em { 
	font-style : italic; 
	}

sup, 
sub { 
	position : relative;
	font-size : 75%; 
	line-height : 0; 
	}

sup { 
	top : -.5em; 
	}

sub { 
	bottom : -.25em; 
	}

address { 
	font-style : normal;
	}

/* 4.LINKS */

a, 
a:visited {
	outline : none;
	color : #00F; 
	text-decoration : none; 
	}
 
a:hover { 
	outline : none;
	color : rgb(40,40,40); /* hex code can be used here too */
	text-decoration : underline; 
	}
 
a:active, 
a:focus { 
	outline : none;
	color : rgb(0,0,0); /* hex code can be used here too */
	}

/* 5.NAVIGATION/MENU */

/* Feel free to change up this area as you see fit in order
to best suit your design. */

div#menu {
	 margin-top:8px;
	 margin-bottom:5px;
	 background-image:url(gfx/nav_bg.png);
	 height:51px;
	}

ul#nav {
margin: 0;
padding: 0;
border-left: 1px solid #fff;
width: auto;
margin-top: 7px;
margin-left:20px;
}

	ul#nav li {
		float: left;
		padding: 0;
		list-style: none;
		list-style-image: none;
		border-right: 1px solid #b4b4b4;
		}
		ul#nav li.last {border-right: none;
			}
		ul#nav li.first {
			}
		ul#nav li a {
			font-size: 12px;
			text-decoration: none;
			line-height:25px; /* line height is better than top and bottom padding */
			display: block;
			text-align: left;
			padding: 0px 8px;
			white-space: nowrap;
			font-weight: bold;
			text-transform: uppercase;
			color: #fff;
			}
		/* yes, you can combine the bottom two styles if you would like or need to */	
		ul#nav li.current a {
		    color: #a5ceff;
			 
			}
		ul#nav li a:hover {
			color: #a5ceff;
			 
			}
			
		/* second level dropdown */	
		ul#nav li ul { /* second-level lists */
			position: absolute;
			width: 10em;
			left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
			margin-left:-25px;
		}
		
		ul#nav li ul li a, ul#nav li.current ul li a { /* second level dropdown buttons */
			width:200px;
			background-color: #666;
			border-bottom: 1px solid #999;
			line-height:26px;
			color:#fff;
			}
		
		ul#nav li ul li a:hover, ul#nav li.current ul li a:hover { /* second level dropdown button hover state */	
			background-color: red;
			border-bottom: 1px solid #900;
			color:#fff;
			}
		
						ul#nav li ul li ul li a, ul#nav li.current ul li ul li a { /* third level dropdown buttons */
							width:200px;
							background-color: #00F;
							border-bottom: 1px solid #06F;
							line-height:26px;
							color:#fff;
							}
						
						ul#nav li ul li ul li a:hover, ul#nav li.current ul li ul li a:hover { /* third level dropdown button hover state */						
							background-color: red;
							border-bottom: 1px solid #900;
							color:#fff;
							}
		 
		ul#nav li ul li ul { /* third-and-above-level lists */
			margin: -1em 0 0 200px;
		}
		 
		ul#nav li:hover ul li ul, ul#nav li:hover ul li ul li ul, ul#nav li.sfhover ul li ul, #nav li.sfhover ul li ul li ul {
			left: -999em;
		}
		 
		ul#nav li:hover ul, ul#nav li ul li:hover ul, ul#nav li ul li ul li:hover ul, ul#nav li.sfhover ul, ul#nav li ul li.sfhover ul, ul#nav li ul li ul li.sfhover ul { /* lists nested under hovered list items */
			left: auto;
		}

/* 6.MAIN */

/* this can be deleated and replaced*/

#logo {
	width:356px;
	height:136px;
	background-image:url(gfx/logo.jpg);
	margin:15px;
	}
	
#cta {
	background-image:url(gfx/cta.png);
	margin-left:600px;
	width:351px;
	height:105px;
	position:absolute;
	margin-top: -110px;
	top: 155px;
}

.header {
	background-image:url(gfx/header_bg.jpg);
	background-repeat:repeat-x;
	position:relative;
	height:auto;
	}

.animation {
	height:361px;
	
	width: 950px;
	}
	
	
.content {
	padding:15px 0px;
	background-image:url(gfx/content_bg.jpg);
	background-repeat:no-repeat;
	}	
	
#wrapper-footer {
    width:100%;
	background-image:url(gfx/wrapper_footer.jpg);
	background-repeat:repeat-x;
	height:495px;
	}	
	
#wrapper-header {
	width:100%;
	background-image: url(gfx/wrapper_header.jpg);
	background-repeat:repeat-x;
	}	
	
#wrapper-content {
	width:100%;
	background-image: url(gfx/wrapper_content.jpg);
	background-repeat:repeat-x;
	}

/****FOOTER****/	
	
.footer {
margin-top: 18px;
}

.footer p {
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	text-align: left;
	 
}
.footer h3 {
    color: #fff;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 15px;
    font-weight: normal;
    margin-bottom: -9px;
    text-align: left;
}
	
/* callout */
.callout {
	height: 654px;
	text-align:center;
	background-image:url(gfx/callout_bg.html);
	background-repeat:no-repeat;
	background-position:center top;
	
	}
	
.callout h3 {
  color: #001745;
  font-size: 30px;
  line-height: 21px;
  margin: 5px 14px 14px;
  text-align: center;
  font-weight: bold;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: lighter;
}

 .callout p {
  color: #001b4d;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 20px;
  height: 60px;
  line-height: 20px;
  margin: 163px 11px 0;
  text-align: center;
  width:450px;
  
}
	
.c1 {
  background-image:  url(gfx/callout_1.png);
  background-position: center top;
  background-repeat: no-repeat;
  height:334px;
   
 
}
	
.c2 {
	background-image:  url(gfx/callout_2.png);x
	background-position: center top;
	background-repeat: no-repeat;
	height:334px;
	 
     
}
	
 

 
 
	
/* expanding button using the sliding door technique and sprites */
	
a.callout-buttona {
  background-image: url("gfx/findmore_btn.png");
  background-position: left top;
  background-repeat: no-repeat;
  bottom: 72px;
  color: #111111;
  display: block;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 12px;
  font-weight: bold;
  height: 25px;
  line-height: 28px;
  margin-left: 148px;
  margin-top: 6px;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px 1px #CCCCCC;
  width: 164px;
}
 
a.callout-buttonb {
  background-image: url("gfx/contact_btn.png");
  background-position: left top;
  background-repeat: no-repeat;
  bottom: -375px;
  color: #111111;
  display: block;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 12px;
  font-weight: bold;
  height: 25px;
  line-height: 28px;
  margin-left: 101px;
  margin-top: 6px;
  right: 294px;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px 1px #CCCCCC;
  width: 264px;
}

a.callout-buttonc {
  background-image:url(gfx/moreinfo_btn.html);
  background-position:left top;
  background-repeat: no-repeat;
  bottom: -376px;
  color: #111;
  display: block;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 12px;
  height: 25px;
  line-height: 28px;
  right: 944px;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px 1px #ccc;
  margin-left: 170px;
  margin-top:  23px; 
  width: 114px;
  font-weight: bold;
}
/* 7. WIDGET AREAS */



/* 8.WIDGET STYLING */

/* Change the overall widget-wrapper class, you may add additional properties in 
this area as needed such as border, border-radius, etc. Calculator ID's are used
because their backgrounds are super, ultra stubborn to get rid of */
.widget-wrapper, .single-tab-wrapper .widget-wrapper {
	float:left;
	}

.widget-wrapper,
div[id*="widget"] div#UnitCalc, 
div[id*="widget"] div#CaloriesCalc, 
div[id*="widget"] div#MortageCalc, 
div[id*="widget"] div#PregnancyCalc, 
div[id*="widget"] div#TaxCalc {
	background: none; /* replace color here */
	position: relative; 
	z-index: 09; 
	float:left;
	border:1px solid #7e7e7e;
	padding:0px;
	}
	
/* add widget header bg that will show up as a tab-styled graphic for the h3 below */ 
.widget-title {
	background: #032573;
	border-bottom: 1px solid #ccc;
	position: relative; 
	z-index: 09; 
	}
	/* the heading tag within each widget, this will change heading style for widgets 
	specifically, don't forget about font color */
	.widget-title h3 {
		color: #fff;
		margin: 0;
		}

.widget-body { /* should correct centering of elements inside of most widgets */
	text-align: center;
	padding:10px 0px;
	height:auto;
	}
	.widget-body p { /* can further effect elements inside on most widgets */
		text-align: left; 
		}

div#twtr-widget-1 div.twtr-doc div.twtr-hd h3 {
	display: none;
}

/* 9.MODULES */

/* click to call link*/
a.sms-button {
	width: 150px;
	display:inline;
	font-size:12px;
	line-height:32px;
	}

/* facebook like link */
div#fblike {
	float: left;
	margin: 15px;
	color: #333;
}

/* default contact us form */
div#contact_us_container {
	/* should inherit most of the body styling */
	}
	div#contact_us_container .astrix{
		color: red;
	}




/* search module */
div#modulesearch {
	position: absolute;
	top: 5px;
	right: 15px;
	background-image: url(gfx/bg-search.html);
	height: 27px;
	width:229px;
}

div#modulesearch form {height:27px; padding:0px; margin:0px;}

.search_field {
    background-color: transparent;
    border: medium none;
    height: 25px;
    line-height: 25px;
    padding-left: 15px;
    width: 170px;
	display:inline;
}

.search_button {
    background-color: transparent;
    border: medium none;
    cursor: pointer;
    font-size: 0;
    height: 27px;
    margin: 0;
    width: 38px;
    text-indent:-9999px;
	div#modulesearch
}

/* print page and send to friend links found in content area */
span.print-page-link, 
span.sendtofriend-link {
	margin: 0px 5px 0px 10px;
	display:inline;
	font-size:12px;
}


/* send to phone */

#send-to-phone-content p {
    margin: 0 0 20px;
    padding: 0;
	color:#000;
}

.sendtoafriend_wrapper .column_One, .sendtoafriend_wrapper  .column_Two {margin-bottom:0px !important;}

/* send to firend */

.sendtoafriend_body {
  background-color: #FFFFFF !important;
}

/* language link styling for spanish, french, and english */
div#languagelinks {
}

/* 10.FOOTER AREA */

/* mirror module for utility nav */
ul#mirror-menu-module {
	width: 960px;
	margin: 5px auto;
	padding: 11px 0 13px;
	clear: both;
	position: relative; 
	z-index: 0; 
	font-size:12px;
	text-align:center;
	}
	ul#mirror-menu-module li {
		display: inline; /* remove and add float if you want the text left justified */
		/*float: left;*/
		padding: 0 5px;
		list-style: none;
		text-align: center;
		border-left: 1px solid #FFFFFF;
			}
	ul#mirror-menu-module a {
		color:#fff;
		 
		}
		ul#mirror-menu-module a:hover {
			color:#fff;
			}

/* misc links and text that may be generated using platform dynamic tags*/
div#footerdata, 
span.footerLinks {
	text-align: center;
	margin: 10px auto;
	clear: both;
}

a.print-map {
	font-size: 10px;
}

/* ATT Copyright */
div#copyright {
	clear: both;
	margin: 15px auto;
	text-align: center;
	font-size: 12px;
	color:#fff;
}

/* 11.WEBSPLANET DEFAULT */

/* WebsPlanet Platform Default classes for many of their
dynamic tags that we may not have covered above. This should
hypothetically overwrite any styling we made above if you style
the below classes. NOTE: Be sure that you are targeting the 
correct class selector below.  */

.languages {}
.headerimage {}
.slogan {}
.logo {}
.menu {}
.menu_rollover {}
.menu_active {}
.skinBg {}
.skinAlign {}
.footerText {}
.footerLinks {}

.text {}
.titles {}
.titles_path {}
.titles_in {}

.modules_table_border {}
.modules_table_data {}
.modules_td {}
.dark_text {}
.dark_links {}

.content_pages_table {}
.content_pages_table td {}

.nextprevout {}
.nextprevin {}
.nextprevactive {}

.printv_link {}
.printv_table {}
.printv_body {}
.printv_content_title {}
.sendtoafriend_link {}
.sendtoafriend_body {}
.sendtoafriend_data {}

.astrix {}
.form_field_text {}
.text_field {}
.text_field_big {}
.buttons {}

.search_button {}
.search_field {}
.search_text {}
.search_result_highlight {}

.login_field {}

.side_menu {}
.side_menu_sub {}

.gallery_titles {}
.gallery_text {}
.gallery_links {}

.user_normal {}
.user_self {}
.user_admin {}
.quote {}

.price {}
.top_categories_titles {}
.multimulti_attribute_image {}

.replies_page_toplinks_table {}
.replies_page_toplinks_td {}
.replies_page_toplinks_link {}
.replies_page_replylink {}

/* Modules */

.module-wrapper {}
.module-title {}
.module-content {}



/* Forms Manager Font size and color */ 

#formsmanager-wrapper-one-col label.form_field_text, #formsmanager-wrapper-one-col .aremandatory, #formsmanager-wrapper-one-col label {
	font-size:12px;
	line-height:22px;
	margin-bottom:0px;
	}
	
label.form_field_text, .aremandatory, label {
	font-size:12px;
	line-height:22px;
	margin-bottom:0px;
	}	


/*  Single Coulmn */
#formsmanager-wrapper-one-col .column_One {	
width:100%;
	}


#formsmanager-wrapper-one-col .column_Two, #formsmanager-wrapper-one-col .column_Two .form-row {
 display: none;
 margin-bottom:0px;
 }
 
#formsmanager-wrapper-one-col .aremandatory {
font-weight: bold;
color: #F00;
} 

#formsmanager-wrapper-one-col input.text_field {
	width:50%;
	}
	
#formsmanager-wrapper-one-col .text_field_big  {
width: 70%;
margin-bottom:20px;
}

/* end single coulmn */

.form-buttons {
margin: 0 0 20px;
width: 100%;
}

.text_field_big {
  width: 95%;
  margin-bottom:20px;
}

.column_One, .column_Two {
width: 50%;
margin-bottom:20px;
}

#formsmanager-wrapper .form-row {
float: left;
width: 100%;
}

#formsmanager-wrapper .form-row input {
	width:95%;
	}

	.form-row .form_field_text {
		width: 100%;
		float: left;
		}
	#contact_us_forms_field > .form-row {
		clear: both;
		}
		#contact_us_forms_field > .form-row .form_field_text {
		width: auto;
		max-width: 250px;
		min-width: 20%;
		}
		
.form-row label {
margin-right: 20px;
}

.column_Two .form-row .form_field_text, .column_one .form-row .form_field_text {
width: 100%; 
margin-right: 10px;
float: left;
}

.form-row br {
display: none;
}


#formsmanager-wrapper .column_Two {
float: left;
display: block;
}

#formsmanager-wrapper .column_One {
float: left;

}

.widget-wrapper {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #7e7e7e;
    padding: 0;
    position: relative;
    z-index: 9;
}

.widget-body {
    height: auto;
    padding: 10px;
    text-align: center;
}

.emphasis {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #a4bfda;
    font-size: 18px;
    font-weight: bold;
    margin: 0 50px;
    padding: 10px;
    text-align: center;
}

.textcenter {
	text-align: center;
	margin-top: 40px;
}