@charset "utf-8";
/*

Filename: 		styles.cfm
Location:		skyweb/APPS/bod/redesign
Date Created:	5/28/2010
Created By:		Kathryn A Kosey

Description:	styles for the redesigned version of Boost On Demand

______________________Modifications_______________________

Date:		
Note By:	
Note:		



______________________________________________________*/


/* ________ GLOBAL _________ */
body{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	background-color: #0eadb9;
	margin-top:0px;
	margin-bottom:0px;
	background-image:url(images/background.jpg);
	background-repeat:repeat-x;
	background-position: center; 
	background-position: top;
}
a{
	text-decoration: none;
	color: #ff5a1b;
}
a:hover{
	text-decoration: underline;	
}
.imagecontainer{	
	width:1000px;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	background-image:url(images/backshadow.png);
	background-repeat:repeat-y;
	min-height:707px;
}
.container{	
	width:960px;
	position:relative;
	margin-left: 20px;
	/*margin-right: 35px;*/
	min-height:707px;
	background-color:#FFFFFF;
}

/* ________ HEADER _________ */

/* -- dropdown menu styles later in stylesheet --*/

.header{
	min-height: 110px;
	width:100%;
	background-image:url(images/header.gif);
	/* background-color: #b3e9ed; */
}
.logo{
	float:left;
	border:none;
	margin-left:20px;
	margin-top:10px;
	background-image:url(images/logo.png);
	background-repeat:none;
	width: 172px;
	height:90px;
}
.logo:hover{
	background-image:url(images/logo-home.png);
}
.redeem{
	float:right;
	border:none;
	color:#FFFFFF;
	font-weight:700;
	margin-top:2px;
	margin-right:10px;
	padding-top:3px;
	padding-left:7px;
	background-image:url(images/redeem.png);
	background-repeat:none;
	width: 118px;
	height:22px;
		
}
.redeem:hover{
	background-image:url(images/redeem_hover.png);
	color:#f6c1ac;
	text-decoration:none;
}
.phonenum {
	color:#07a0ab;
	float:right;
	font-size:14pt;
	font-weight:bold;
	position:relative;
	/*background-image:url(images/phonenum.png);
	background-repeat:none;*/
	text-align:center;
	left:130px;
	top:85px;
	padding-top: 3px;
	height:26px;
	width:140px;	
}
.links{
	text-align:right;
	padding-top:7px;
	padding-right:10px;
	height:25px;
	background-color: #717174;
	background-image:url(images/headerbar-tile.gif);
	background-repeat:repeat-x;
	color:#FFFFFF;
}
.links a{
	font-weight:700;
	color:#FFFFFF;
	text-decoration:none;
	margin-left:5px;
	margin-right:5px;
}
.links a:hover{
	color:#a7dde4;
}

/* ________ FOOTER _________ */

.footer{
	width:100%;
	min-height: 100px;
	text-align: center;
	background-color: #ffffff;
	padding-top:10px;
}
.footer a{
	font-weight: 700;
}
.socialwrapper{
	float:right;
	position:relative;
}
.socialmedia{
	position:absolute;
	width: 80px;
	right:10px;
	top:40px;
}
.socialmedia a img{
	border:none;
	padding-right:5px;
}

/* ___________________ MAIN CONTENT ___________________ */

.maincontent{
	background-color: #FFFFFF;
	width:100%;
	min-height:500px;
	/*margin-top: 10px;*/
	padding-bottom:20px;
}

/* ________ BANNER _________ */

.banner{
	width:100%;
	background-color: #EEEEEE;
	min-height: 220px;
}
.bannerimage{
	float:right;
	background-color:#DDDDDD;
	width:320px;
	height:180px;
	margin:15px;
	margin-bottom:0px;
	border: 2px solid #666666;
	text-align:center;
}
.bannertext{
	padding-left: 15px;
	padding-right: 10px;
	padding-top: 5px;
}
.bannertext ol{
	padding-left:20px;	
}
.homebanner{
	margin-top:10px;
	padding-bottom:10px;
	background-color:#FFFFFF;
}
.slideshow{
	margin-left:20px;
	/* following attributes are to keep all images from showing up for a brief moment during load */
	overflow:hidden;
	width: 920px;
	height: 200px;
}
.slideshow img{
	border:none;
}
.slideshow img.first{
	display: block;
}
.rewards{
	margin-left:0px;
	margin-top:15px;
	margin-bottom:10px;
	width: 920px;
	height: 205px;
}

/* ________ MAIN _________ */

.centerbox{
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 15px;
	width:100%;
	text-align:center;
}
.middlebox{
	padding-left: 30px;
	padding-right: 30px;
	text-align:left;
}
.leftbox{
	padding-left: 20px;
	padding-right: 10px;
	margin-top: 15px;
	max-width:800px;
}
.articlebox{
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 30px;
	max-width:800px;
}
.rightbox{
	margin-top: 15px;
	margin-left:10px; /* controls the space between this div and the main content */
	margin-right:20px;
	float:right;
	text-align:center;
}
.rightbox img{
	margin-bottom: 5px;
}
.rightbox p{
	text-align:left;
	padding-left: 10px;
	padding-right:10px;
	margin-top:0px;
}
.clear{
	clear: both;
	width:100%;
}
.overview{
	padding: 0px;	
}
.overviewcall img{
	border: 2px solid #FFFFFF;
}
.overviewcall:hover img{
	border: 2px solid #FF5A1B;	
}

/* ________ TRIPLEDIV _________ */

.triplediv{
	margin-top: 20px;
	width:100%;
	text-align:center;
}
.triplebox{
	width: 200px;
	display:-moz-inline-box;/* Firefox 2 and under*/
	display:inline-block;/* FF3, Opera, Safari */
	vertical-align:bottom;
	padding: 10px;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: inline; /* star hack to target IE 6&7 */
}
.triple1home{
	margin-right:5px;
}
.triple3home{
	margin-left:5px;
}
.triplehome{
	background-color:#DDDDDD;
	background-image: url(images/triplehome2.gif);
	font-size:13pt;
	font-weight:bold;
	color:#FFFFFF;
	width:280px;
	min-height:200px;
	padding-top:30px;
	_height: 200px; /* underscore hack to target IE 6 */
}
.triplehome div{
	padding-left:30px;
	padding-right:30px;
}
.triplehome div img{
	position:relative;
	top:-25px;
}
.triplehome a{
	display:block;
	background-image:url(images/triplebutton.png);
	background-repeat:no-repeat;
	min-height:41px;
	max-height:41px;
	max-width:224px;
	text-align:left;
	padding-top:10px;
	padding-left:21px;
	margin-left:20px;
	position:relative;
	top:140px;
	color:#FFFFFF;
	text-decoration:none;
}
.triplehome a:hover{
	color:#a7dde4;
	background-image:url(images/triplebutton_hover.png);
	background-repeat:no-repeat;
}
.triplebenefits{
	width: 270px;
	text-align:justify;
	vertical-align:top;
}
.triple1benefits{
	margin-right:10px;
}
.triple3benefits{
	margin-left:10px;
}
.triplebenefits p{
	text-indent:20px;
	line-height: 120%;
}
.triplebenefits p.first{
	text-align:left; 
	text-indent: 0px;
	margin:0px;
}
.triplebenefits p.secondary{
	text-indent: 0px;
	margin-top:0px;
}
.triplepic{
	float:left;
	margin-right:10px;
}
.benefittitle{
	width:100%; 
	background-image:url(images/headerbar-tile.gif);
	background-repeat:repeat-x;
	color:#ffffff; 
	text-align:center;
	vertical-align:middle;
	height:30px; 
	margin-bottom:5px;
	padding-top:8px;
	font-weight: 700;
}

/* ________ STEPS _________ */

.steps{
	margin-top: 20px;
	padding-top:10px;
	width:100%;
	text-align:center;
}
.stepdiv{
	width:18%;
	margin-left:5px;
	margin-right:5px;
	display:-moz-inline-box;/* Firefox 2 and under*/
	display:inline-block;/* FF3, Opera, Safari */
	font-size:12px;
	text-align:left;
	vertical-align:top;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: inline; /* star hack to target IE 6&7 */
}
.stepdiv ul{
	padding-left:0px;
	margin-top:2px;
	margin-left:0px;
	*list-style: none; /* star hack to target IE 6&7 */
}
.stepdiv li{
	margin-left:15px;
	list-style:disc;
}

/* ________ PRICING TABLE _________ */

.pricingtable{
	width:800px;
	margin:10px;
	margin-left:30px;
	border: solid 1px;
}
.pricingtable td{
	padding: 5px;
}
.pricingtable .black td{
	border: solid 2px #575759;
}
.pricingtable .platinum td{
	border: solid 2px #999a9e;
}
.pricingtable .gold td{
	border: solid 2px #a08250;
}
.pricingtable .silver td{
	border: solid 2px #8c8d91;
}
.pricingtable .bronze td{
	border: solid 2px #5f4c3b;
}

/* ________ MISCELLANEOUS _________ */

.q{
	list-style-image:url("images/q.gif");
	font-weight:700;
}
.a{
	list-style-image:url("images/a.gif");
	margin-bottom:15px;
}
.privacy li{
	margin-bottom:5px;	
}

/* ________ NEWS _________ */

.articlebox{
	padding-left:20px;
}

.articlebox h1{
font-size: 15.6px;
margin-bottom: 15px;
}

/*-------------- menu styles --------------*/

div.outside{
position:relative;
left:455px;
bottom:5px;
padding-bottom:5px;
width:500px;
*left:12px;
*width:510px;
	}
#navigation-1 {
	padding:3px 5px 5px 5px;
	margin:0px;
	list-style:none;
	width:100%;
	height:18px;
	font:normal 10pt arial;
}
#navigation-1 li {
	margin:0;
	padding:0;
	display:block;
	float:left;
	position:relative;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: block; /* star hack to target IE 6&7 */

}
#navigation-1 li a:link, 
#navigation-1 li a:visited {
	padding:4px 0;
	display:block;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	height:13px;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: block; /* star hack to target IE 6&7 */
}
#navigation-1 li:hover a, 
#navigation-1 li a:hover, 
#navigation-1 li a:active {
	padding:4px 0;
	display:block;
	text-align:center;
	text-decoration:none;
	color:#a7dde4;
	height:13px;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: block; /* star hack to target IE 6&7 */
}
#navigation-1 li ul.navigation-2 {
	margin:0;
	padding:5px 0px 0;
	list-style:none;
	display:none;
	position:absolute;
	top:21px;
	left:-1px;
	border-top:none;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: none; /* star hack to target IE 6&7 */
}
#navigation-1 li:hover ul.navigation-2 {
	display:block;
	zoom: 1;/* IE 6&7 Triggers hasLayout*/
    *display: block; /* star hack to target IE 6&7 */
}
#navigation-1 li ul.navigation-2 li {
	clear:left;
	width:210px;
	
}
#navigation-1 li ul.navigation-2 li a:link, 
#navigation-1 li ul.navigation-2 li a:visited {
	clear:left;
	background:#4e4e50;
	color:#ffffff;
	padding:4px 0;
	border:none;
	position:relative;
	z-index:1000;
	margin-left: 0px;
	margin-right:0px;
	height: 18px;
}
#navigation-1 li ul.navigation-2 li:hover a, 
#navigation-1 li ul.navigation-2 li a:active, 
#navigation-1 li ul.navigation-2 li a:hover {
	clear:left;
	color:#a7dde4;
	padding:4px 0;
	border:none;
	position:relative;
	z-index:1000;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 {
	display:none;
	margin:0;
	padding:0;
	list-style:none;
	position:absolute;
	left:10px;
	top:-2px;
	padding:1px 1px 0 1px;
	border:1px solid #000000;
	border-left:1px solid #000000;
	background:#ffffff;
	z-index:900;
}
#navigation-1 li ul.navigation-2 li:hover ul.navigation-3 {
	display:block;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:link, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:visited {
	background:#333333;
}
#navigation-1 li ul.navigation-2 li ul.navigation-3 li:hover a, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:hover, #navigation-1 li ul.navigation-2 li ul.navigation-3 li a:active {
	background:#666666;
}
#navigation-1 li ul.navigation-2 li a span {
	position:absolute;
	top:0;
	left:10px;
	font-size:12pt;
	color:#fe676f;
}
#navigation-1 li ul.navigation-2 li:hover a span, #navigation-1 li ul.navigation-2 li a:hover span {
	position:absolute;
	top:0;
	left:10px;
	font-size:12pt;
	color:#ffffff;
}