/*-----------------------------------------------------------------------------
Mobile Broadband Core Style Sheet

version:   1.0
author:    Ivan Slade, Massive Interactive

/*----------------------------------------------------------------------------
COPYRIGHT, ALL RIGHTS RESERVED. THIS FILE MAY NOT BE COPIED OR ALTERED IN ANY WAY
-----------------------------------------------------------------------------*/

/* = General
--------------------------------------------------------*/
#mbbbg {
	background: #D1EDF9 url(../img/mbbbg.jpg) top repeat-x; padding: 20px 0 0 20px; width: 760px}
.cntr {text-align:center}
.textBtnRed{
	background:url("../img/buttons/redRightnoShadow.gif") no-repeat right top;
}
.textBtnRed span{
	background:url("../img/buttons/redLeftnoShadow.gif") no-repeat left top;
}
.topMargin {margin-top: 20px}
.saPad {margin: 20px 0}
/* = Typography
--------------------------------------------------------*/
#mbbbg h3 {font: bold 20px Arial, Helvetica, sans-serif; color:#fff}
#mbbbg h4 {font: bold 20px Arial, Helvetica, sans-serif; color:#008698}
.mbb_subTitle, .mbb_subTitle2 ,.mbb_subTitle3 {font-weight:bold; font-size:1.2em; color:#105761}
.mbb_subTitle2 {margin-right: 170px}
.mbb_subTitle3 {margin-right: 150px}
p.small {font-size: 1em}
.left {text-align:left !important}
.mbb_col3 a {color:#fff}
.mbb_col4 h4, .mbb_col4 p {margin-left: 200px}
#mbb_col1 a, .mbb_col1 a, .mbb_col2 a, .mbb_col3 a, .mbbScroller a  {text-decoration:underline}
.mbb_col2 a.textBtnRed, .mbb_col3 a.textBtnRed {text-decoration:none !important}

/* = Containers
--------------------------------------------------------*/
.quadColumn {position: relative}
#mbbbg {background: #D1EDF9 url(../img/mbbbg.jpg) top repeat-x; padding: 20px 20px 0 20px; width: 720px}
#mbbbg.city {padding-bottom: 180px}
#mbbbg.cityCoverage {padding-bottom: 240px}
#topClouds {width: 280px; height: 14px; background: transparent url(../img/topclouds.gif) no-repeat; position: absolute; top: 20px; right: 15px}
#coverageClouds {width: 211px; height: 83px; background: transparent url(../img/coverageclouds.gif) no-repeat; position: absolute; top: 20px; right: 245px}
#bundleClouds {width: 664px; height: 117px; background: transparent url(../img/bundleclouds.gif) no-repeat; position: absolute; top: 15px; right: 30px}
#standAloneClouds {width: 638px; height: 78px; background: transparent url(../img/standaloneclouds.gif) no-repeat; position: absolute; top: 45px; right: 80px}
#topBranch {width: 210px; height: 69px; background: transparent url(../img/branch.gif) no-repeat; position: absolute; top: 40px; right: 8px}
#mbb_col1, .mbb_col1, .mbb_col2, .mbb_col4, .mbb_2col {position: relative; width: 340px; padding: 10px; margin-right: 20px; float: left; background: transparent url(../img/panelgradient.png) top repeat-x; border-top: 1px solid #C1E7F0; border-bottom: 1px solid #EFF9FB; z-index: 100}
#mbb_col1 {margin-bottom: 120px; clear: left;}
.mbb_col1 {margin-bottom: 120px; clear: left;}
.mbb_col2 {width: 315px; margin:0 0 20px 0;}
.mbb_col3, .mbb_col31col {position: relative; width: 315px; float: left; padding: 10px; margin-top: 20px; border-top: 1px solid #3594A6; border-bottom: 1px solid #368C99; background:transparent url(../img/col3bggradient.jpg) top repeat-x; z-index: 100; color:#fff; margin-right:25px; height:120px;}
.mbb_col4 {width: 701px; float: none; font-size: 0.9em; margin: 60px 0 0 0}
.mbb_col4_img {position:absolute; left: 120px; top: 8px}
.mbb_2col {width: 320px}
.deviceBanner {position:absolute; top: 0; left: 0}
#helpCol {margin-top: -150px; width: 340px; color:#fff}
#birds {position: relative; width: 340px; height: 162px; background: transparent url(../img/birds.png) center center no-repeat;_background:transparent url(../img/birds.gif) center top no-repeat}
#singleBird {position: relative; margin: 40px 0 0 10px; width: 70px; height: 43px; background: transparent url(../img/singleBird.gif) no-repeat}
#birdsNest {position: absolute; top: 10px; right: 8px; width: 183px; height: 136px; background: transparent url(../img/birdsNest.gif) no-repeat}
#sun {position: absolute; top: 10px; right: 8px; width: 120px; height: 122px;}
#standAloneBird {position: absolute; top: 8em; right: 31px; width: 71px; height: 45px; background: transparent url(../img/standalonebird.gif) no-repeat}
#birdCloudDevice {position: absolute; top: 20px; right: 50px; width: 261px; height: 128px; background: transparent url(../img/birdcloud_device.gif) no-repeat}
#cityFooter {background: transparent url(../img/cityfooter.gif) top no-repeat; width: 760px; height:238px; position: absolute; bottom: 0; z-index:1}
#manBottomBundle {background: transparent url(../img/manbottombundle.jpg) top no-repeat; width: 211px; height:215px; position: absolute; bottom: 0px; right:-260px; z-index:1}
/*plan columns*/
/*#planCon1, #planCon2 {float: left; width: 348px}
#planCon1 {margin-right: 20px}*/
#planCon {width: 680px; position:relative}
.saPlanCon1 {float: left; width: 192px}
.mbb_planCol, .mbb_singlePlanCol {position: relative; /*width: 328px; float: left;*/ background: transparent url(../img/plan_col_bg.jpg) repeat-y; padding: 0 8px}
.mbb_singlePlanCol {background: transparent url(../img/sa_col_bg.jpg) repeat-y;padding: 0 5px}
.mbb_planColFooter, .mbb_singlePlanColFooter {position:relative; width:680px; height:10px; background: transparent url(../img/plan_col_footer.jpg) no-repeat} 
.mbb_singlePlanColFooter {background: transparent url(../img/saplancolfooter.jpg) no-repeat; width: 192px}
.planPrice {margin-bottom: 10px}
/*sliders*/
.mbb_planCol .mod1Col, .mbb_planCol .modCopy1col, .mbb_singlePlanCol .mod1Col, .mbb_singlePlanCol .modCopy1col{
	width:165px;
	float:left;
}
.mbb_planCol .mod1Col .modBorder, .mbb_singlePlanCol .mod1Col .modBorder{
	width:165px;
	background-image: url("../img/sliderBorder.gif");
}
.mbb_planCol .mod1Col .modFooter, .mbb_singlePlanCol .mod1Col .modFooter{
	background-image: url("../img/sliderFooter.jpg");
	width:165px;
	height: 7px
}
.mbb_planCol .mod1Col .modCopy,.mbb_planCol .modCopy1col, .mbb_singlePlanCol .mod1Col .modCopy,.mbb_singlePlanCol .modCopy1col{
	width:140px;
}
.mbbScroller {overflow:auto !important; height: 25em}
.mbbScroller .modCopy1col {width: 90%}
.planInfo {margin: 0 0 5px 50px}
.price {font-size: 1.7em; line-height: 1em}
.cntr img {float:none !important; margin: 1px auto}
.tripleMod .textBtnRed {top:21.2em}
#tenDollarBanner {position: absolute; top: 0; right: 0}
/*Panel headers*/
.usage h2 a, .plan h2 a, .overview h2 a {background:url(../img/petrolplusicon.gif) left center no-repeat; padding: 0 0 0 20px; float: left; font-weight:bold}
.plan h2 a {background:url(../img/blueplusicon.gif) left center no-repeat}
.overview h2 a {background:url(../img/purpleplusicon.gif) left center no-repeat}
.usage.active h2 a {background:url(../img/petrolminusicon.gif) left center no-repeat}
.plan.active h2 a  {background:url(../img/blueminusicon.gif) left center no-repeat}
.overview.active h2 a  {background:url(../img/purpleminusicon.gif) left center no-repeat}
/* drop down panels*/
.mbb_linkPanel {margin-left: 200px; margin-top: 5px}
.linkarrow {background: transparent url(../img/minilinkarrow.gif) 0 50% no-repeat; padding: 0 0 0 11px; margin: 0 20px 0 0}
.panelOpen {background: transparent url(../img/minilinkarrowdown.gif) 0 50% no-repeat;  padding: 0 0 0 11px; margin: 0 20px 0 0}
.dropPanel {position: relative; display:none; width: 450px}
.specCol {float: left; width: 40%; margin-right: 20px}
.dropPanel p {margin-left: 0}
.dropPanel ul {margin-left: 1.75em}
.dropPanel li {list-style-type:disc; margin-bottom: 0.2em}
/* BEGIN 4 COLUMN WIDE MODULES */

.mod4Col{
	width:698px;
	float:left;
	margin: 20px 0 0 10px
}
.mod4Col .modBorder{
	width:698px;
	background-image: url("../img/termsborder.gif");
}
.mod4Col .modFooter{
	background-image: url("../img/termsfooter.jpg");
	background-repeat: no-repeat;
	width:698px;
}
.mod4Col .modTop{
	background-image: url("../img/4columnTop.gif");
	width:698px;
}
.mod4Col .modCopy{
	width:667px;
}

/*V2 panel styles*/
.mbb_1ColPlan {
	float: left;
	width: 145px;
}
.mbb_2ColPlan {
	margin-left: 198px;
	width: 384px;
}
.mbb_2ColPlan .mbb_Plan  .modCopy1col {width: 360px}
.mbb_planCol {padding-top: 10px; padding-bottom: 10px}
.mbb_Plan {background: transparent url(../img/paneldarkgradbg.jpg) repeat-x; border-bottom: 1px solid #fff; color:#fff}
.mbb_2ColPlan .mbb_Plan {background: transparent url(../img/modemdealbg.jpg) repeat-x; border-bottom: 1px solid #fff; color:#fff}
.mbb_Plan .modCopy1col {width: 120px}
.modHeight115 {
	height:10.4em !important; 
	overflow:hidden;
}
.plansPlus, .plansEquals {float: left; position:relative; margin: 50px 1px 0 1px; background: transparent url(../img/plansplus.jpg) no-repeat; width: 43px; height:43px}
.plansEquals {margin: 50px 0 0 0; width: 35px; height:43px; background: transparent url(../img/plansequals.jpg) no-repeat}
.mbb_linkList, .mbb_linkList2 {
	width:130px;
	bottom:0px;
	background: url(../img/dottedWhiteLine.gif) repeat-x left bottom;
	font-size: 0.8em;
	left: 5px
}
.mbb_linkList a, .mbb_linkList2 a {color: #fff}
.mbb_linkList2 {width: 364px; font-size: 0.9em;bottom: 1px}
a.btnOrange{
	background:url("../img/buttons/arrow-orange.gif") no-repeat 100% 4px;
}
.mbb_linkList a:hover, .mbb_linkList a:focus, .mbb_linkList2 a:hover, .mbb_linkList2 a:focus {color: #000; text-decoration:underline}
#heavyBird {position: absolute; top: 9.75em; right: 180px; width: 47px; height: 49px; background: transparent url(../img/smallheavybird.gif) no-repeat}
#lightBird {position: absolute; top: 30em; right: 180px; width: 47px; height: 49px; background: transparent url(../img/smalllightbird.gif) no-repeat}
p.planDealText {font-weight:bold; color:#008698; float: left; margin: 0.5em 0 0 0}
/* =Tables
-----------------------------------------------------------------------------*/
.gen_table{
	position:relative;
	margin:20px 0 0 5px;
	width:716px;
	padding-bottom: 5px;
}
.quadColumn .gen_table{
	position:relative;
	margin:20px 0 0 5px;
	width:716px;
	padding-bottom: 5px;
}
.gen_table table {background:#fff}
.gen_table tr,.gen_table td,.gen_table th{
	padding: 4px 0 4px 10px;
	margin: 0;
	text-align:center;
	vertical-align:middle
}
#tableShadow {width:720px; height:5px; background: transparent url(../img/tableshadow.jpg) repeat-x; position: absolute; bottom:0}
.bundleTable {width: 460px !important; background: transparent url(../img/bundleTableBorder.gif) top center repeat-y}
.bundleTableFooter {
	background:transparent url(../img/bundleTableFooter.gif) no-repeat scroll left top;
	width:468px;
}
.bundleTable a {float:none; color:#f00; text-decoration:underline; background: transparent url(../img/buyarrow.gif) right 70% no-repeat; padding: 0 7px 0 0}
.mbb_col31col {width: 280px; margin-top: 5px; margin-right: 45px}

/* =sIFR
-----------------------------------------------------------------------------*/

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

h3 .sIFR-hasFlash {
	font-size:30px;
	height:30px;
}

h3 .sIFR-hasFlash .mbb_col3,h3 .sIFR-hasFlash .mbb_col31col{
	visibility: hidden;
	font-size:30px;
	height:30px;
}
h3 .sIFR-hasFlash .mbb_col31col {font-size:20px;height: 30px}
h3 .sIFR-hasFlash .mbb_col3#helpCol {
	visibility: hidden;
	font-size:30px;
	height:30px;
}

h4 .sIFR-hasFlash {
	visibility: hidden;
	font-size: 28px;
	height:28px;
	color: #008698;
}
.mbb_subTitle2 a {
	text-decoration:underline;
}
.floatRightBtn {
	float:right;
	position:absolute;
	bottom:0;
	right:15px;
}
.modHeight216 {
	height: 198px;
}
a.textBtnRedMedium {
	text-decoration: none;
}