/***** Global Styles *****/

* {
	margin:0;
	padding:0;
} 

html, body {
	height:100%;
	color:#000;
	background:white;
	font-family:Arial,Sans-Serif;
	}
	
p {
	font-size: 1em;
	margin: 10px 10px;
	}

a {
    color:#d52b1e;
    text-decoration:underline;
    }

a:focus,a:active,a:hover {
    color:#ff5800;
	}

img {
    border:none;
	}

h1 {
	background:#FFF;
	/*border-bottom:solid 1px #efefef;*/
	font-size:1.2em;
	font-weight:bold;
	margin:10px 0 -22px 0;
	}

h2 {
	font-size:1em;
	font-weight:bold;
	color:#000;
	margin:10px 0 2px 10px;
	text-transform:uppercase;
}

h3, #status h1, #status b {
    font-size:1em;
    font-weight:bold;
    margin:10px 0 10px 10px;
    padding: 0px;
    color: rgb(255, 88, 0)
}

h4 {
	font-size:1em;
    font-weight:bold;
    color:#ff5800;
    margin:10px 0 10px 10px;
}

hr {
	border:0;
	background-color:#efefef;
	width:100%;
	height:1px;
	margin:10px 0px 10px 0px;
}

ul, ol {
	margin: 0px 10px 10px 30px;;
	}
	
ul li, ol li {
	list-style: square outside;
	padding: 0px 0px 10px 0px;
	}

/** delete this chunk if nothing breaks
ul, ul.normal, #iihelp ul {
	margin:0 10px 10px 50px;
	}
ol, #iihelp ol {
	margin:0 10px 10px 30px;
	}
	
ul li, ul.normal li, #iihelp ul li {
	list-style:square outside;
	padding:0 0 10px 0;
	}
ol li, #iihelp ol li {
	padding:0 0 10px 0;
	}
	**/

.li_subtext {
	margin: 0px 0px 0px 10px;
}

.subheader {
	font-weight: bold;
	color:#ff5800;
	padding-bottom: 10px;
}

.subtitle {
	font-weight: normal;
	color: rgb(213, 43, 30);
	}


/*Sticky footer*/

.wrapper {
	min-height:80%;
	height: auto !important;
	margin: 0 auto;
	background:#FFF;
}

.push {
/*	height:6em;*/
}

.footernav {
    height:2em;
    background:#000;
    white-space:nowrap;
}


/*Navigation Menus*/
/**Top**/

.center {
	text-align:center;
}

div#navbar2 {
    padding:0;
	margin:0;
	height: 30px;
    width: 100%;
    background: #000 url(/m/images/nav_bg.png) repeat-x left top;
}
div#navbar2 ul {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.80em;
    color: #000;
    line-height:31px;
    white-space: nowrap;
}
div#navbar2 li {
    list-style-type: none;
    display: inline;
}
div#navbar2 li a {
    font-weight: bold;
    text-decoration: none;
    padding:7px; 
    color: #fff;
}
div#navbar2 li a:link {
    color: #fff;
}
div#navbar2 li a:hover {
    color: #ff5800;
}
div#navbar2 li a.cur {
    font-weight: bold;
    color: #ff5800;
    background: #fff url(/m/images/nav_bg_active.png) repeat-x left top;
    border-left: 1px solid #3b3b3b;
    border-right: 1px solid #3b3b3b;
}
.noborder {
	border-right:0 !important;
}

.clicked {
	background:#000 !important;
	color:#ff5800 !important;
	font-weight:bold !important;
	border-right:0 none !important;
}

/**Icon Navigation**/
/***Styling for iPhone, Android, ***/
div#navicons{
    padding:0;
    width: 100%;
}
div#navicons ul {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.70em;
}
div#navicons li {
    list-style-type: none;
    display: inline-block;
    vertical-align: top;
}
div#navicons li a {
    text-decoration: none;
    padding:10px 0px 0px 6px;
    color: #000;
	font-weight:bold;
    width:61px;
	display:inline-block;
	vertical-align:top;
}
div#navicons li a div {
	margin-bottom: 5px;
}

div#navicons img {
	width:48px;
	height:48px;
	display:inline-block;
}

.clear {
	clear:all;
}

#navicons div.navicon {
    width: 61px;
    height: 61px;
}
a#home_contactus div.navicon { background: url(/images/icon-buttons.gif) 0 -1px; }
a#home_coolstuff div.navicon { background: url(/images/icon-buttons.gif) 0 -64px; }
a#home_hotspots  div.navicon { background: url(/images/icon-buttons.gif) 0 -127px; }
a#home_products  div.navicon { background: url(/images/icon-buttons.gif) 0 -190px; }
a#home_toolbox    div.navicon { background: url(/images/icon-buttons.gif) 0 -253px; }
a#home_email div.navicon { background: url(/images/icon-buttons.gif) 0 -568px;}
a#home_about div.navicon { background: url(/images/icon-buttons.gif) 0 -442px;}
a#home_bob div.navicon { background: url(/images/icon-buttons.gif) 0 -694px;}
a#home_iihelp div.navicon { background: url(/images/icon-buttons.gif) 0 -757px;}
a#home_status div.navicon { background: url(/images/icon-buttons.gif) 0 -820px;}
a#home_news  div.navicon { background: url(/images/icon-buttons.gif) 0 -883px; }
a#home_coffeecam  div.navicon { background: url(/images/icon-buttons.gif) 0 -631px; }
a#home_ringtone  div.navicon { background: url(/images/icon-buttons.gif) 0 -316px; }

a#icon_ringtone div.navicon { background: url(/images/icons.gif) 0 -250px; }
a#icon_sales div.navicon { background: url(/images/icons.gif) 0 -300px; }
a#icon_about div.navicon { background: url(/images/icons.gif) 0 -350px; }
a#icon_business div.navicon { background: url(/images/icons.gif) 0 -400px; }
a#icon_email div.navicon { background: url(/images/icons.gif) 0 -450px;}
a#icon_coffeecam div.navicon { background: url(/images/icons.gif) 0 -500px;}

div#lilicons{
    padding:0;
	margin:0;
    width: 100%;
    background-color: #fff;
}
div#lilicons ul {
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
	margin:10px 0 0 0;
}
div#lilicons li {
    list-style-type: none;
	margin:5px 0 0 5px;
}
div#lilicons li a {
    text-decoration: none;
    color: #000;
    font-weight:bold;
    display:list-item;
    vertical-align:top;
	height:25px;
	font-size:1em;
	overflow:hidden;
}


a.lil_contactus {background: url(../m/images/24icons.gif) no-repeat 0 0; height:24px; padding: 0 0 0 35px; }
a.lil_coolstuff {background: url(../m/images/24icons.gif) no-repeat 0 -25px; height:24px; padding: 0 0 0 35px;}
a.lil_hotspots {background: url(../m/images/24icons.gif) no-repeat 0 -50px; height:24px; padding: 0 0 0 35px;}
a.lil_products {background: url(../m/images/24icons.gif) no-repeat 0 -75px; height:24px; padding: 0 0 0 35px;}
a.lil_toolbox {background: url(../m/images/24icons.gif) no-repeat 0 -100px; height:24px; padding: 0 0 0 35px;}
a.lil_ringtone {background: url(../m/images/24icons.gif) no-repeat 0 -125px; height:24px; padding: 0 0 0 35px;}
a.lil_sales {background: url(../m/images/24icons.gif) no-repeat 0 -150px; height:24px; padding: 0 0 0 35px;}
a.lil_support {background: url(../m/images/24icons.gif) no-repeat 0 -175px; height:24px; padding: 0 0 0 35px;}
a.lil_business {background: url(../m/images/24icons.gif) no-repeat 0 -200px; height:24px; padding: 0 0 0 35px;}
a.lil_email {background: url(../m/images/24icons.gif) no-repeat 0 -225px; height:24px; padding: 0 0 0 35px;}

div#lilicons li ul li a {
	margin:-10px 0 0 30px;
	color:#d52b1e;
	font-weight:normal;
	text-decoration:underline;
	font-size:0.8em;
}

/**Footer Navigation**/
div#footer {
    padding:2px 0px;
    margin:0;
    margin-top: 0px;
    width: 100%;
    background: #000 url(/m/images/banner_bg.png) repeat-x left top;
}
div#footer ul {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.80em;
    color: #fff;
    line-height:27px;
    white-space: nowrap;
    background: #000 url(/m/images/footer_bg.png) repeat-x left top;
}
div#footer li {
    list-style-type: none;
    display: inline;
}
div#footer li a {
    text-decoration: none;
    padding:7px;
    color: #fff;
}
div#footer li a:link {
    color: #fff;
}

/*Black Header Section*/
#header {
	height:30px;
	margin:0 0px;
	padding:10px 0;
	background: #000 url(/m/images/header-bg.png) repeat-x left top;
}


#iinet_logo {
/*	background:url(../m/images/iinetlogo.gif) no-repeat; */
	width:67px;
	height:30px;
	display:block;
	padding-left:.5em;
	float:left;
	}

#call_support {
/*	background:url(../m/images/callsupport.png) no-repeat; */
	margin:0 10px 0 0;
	float:right;
	font-size:0.6em;
	height:30px;
	width:72px;
}

#hdr_contactus {
	background:url(../m/images/contactus.png) no-repeat;
    margin-right:1em;
    float:right;
    font-size:0.6em;
    height:30px;
    width:72px;
}

#hdr_hotspot {
	background:url(../m/images/hotspot-pressed.png) no-repeat;
    margin-right:1em;
    float:right;
    font-size:0.6em;
    height:30px;
    width:72px;
}

#hdr_coolstuff {
    background:url(../m/images/coolstuff-pressed.png) no-repeat;
    margin-right:1em;
    float:right;
    font-size:0.6em;
    height:30px;
    width:72px;
}

#hdr_emailsetup {
    background:url(../m/images/email-pressed.png) no-repeat;
    margin-right:1em;
    float:right;
    font-size:0.6em;
    height:30px;
    width:72px;
}

#hdr_news {
    background:url(../m/images/news.png) no-repeat;
    margin-right:1em;
    float:right;
    font-size:0.6em;
    height:30px;
    width:72px;
}



/*Main Content Section */
#main {
	margin:0 auto;
    padding:0;
    text-align: center;
    color:#000;
	background:#FFF;
    font-family:Arial,Sayns-Serif;
}

#main_left {
	margin:0px;
	padding:0;
	text-align:left;
	color:#000;
	background:#FFF;
	font-family:Arial, Sans-Serif;
	font-size:0.9em;
}

#sitemap {
	margin:0 10px 10px 30px;
}

/*Contact us styling*/
.contact {
	font-weight:bold;
}

.contact a {
	font-weight:bold;
	font-size:0.9em;
}

.contact img {
	padding:0 5px 0 0;
}

/* ul & li styling for chunky stripe style lists */
ul.stripe {
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	border-top: solid 1px #efefef;
	margin-top: 20px;	
}
ul.stripe li {
	list-style-type: none;
	border-bottom: solid 1px #efefef;
	padding:10px 0 15px 0;
	background:url('/m/images/right-arrow.png') no-repeat scroll 99% 40%;	
}
ul.stripe li a {
    text-decoration:none;
	color:#000;
	margin:0 0 0 10px;
}
ul.chevron li {
	background:url(../m/images/right-arrow.png) no-repeat scroll 99% 40%;	
}

/*Hotspots styling */

#main_hotspots {
	margin:0px;
    padding:0px;
    text-align:left;
    color:#000;
    background:#FFF;
    font-family:Arial, Sans-Serif;
	font-size:0.9em;
}

#hotspots {
	padding:0;
	margin:0;
	font-size:0.9em;
}

.description {
    margin:0 0px 10px 10px;
	font-weight:normal;
	width:80%;
	text-transform:uppercase;
}

#hotspots li {
	list-style-type:none;
	border-bottom:solid 1px #efefef;
	background:url(../m/images/right-arrow.png) no-repeat scroll 99% 40%;
	
}

#hotspots a {
	text-decoration:none;
}


.hotspot {
    background:url(/images/icons.gif) no-repeat top left;
    background-position:0px -100px;
    height:48px;
    margin:0 10px;
    padding:0 0 0 60px;
}

/*Ringtone styling*/

#ringtone_phones {
    padding:0;
    margin:0;
}


#ringtone_phones li {
    list-style-type:none;
    border-bottom:solid 1px #efefef;
	padding:10px 0 15px 0;
    background:url(../m/images/right-arrow.png) no-repeat scroll 99% 50%;
}

#ringtone_phones a {
    text-decoration:none;
	color:#000;
	margin:0 0 0 10px;
}

#ringtone_iphone {
	margin:0 10px 10px 30px;
}

#ringtone_iphone li {
	list-style-type:decimal;
	list-style-position:outside;
	padding:0 0 10px 0;
}



.ringtone {
    background:url(/images/icons.gif) no-repeat top left;
	background-position:0 -250px;
    height:48px;
	margin:5px 10px;
    padding:0 0 0 60px;
}


.ringtone p {
	font-size:0.8em;	
}

.ringtone_iphone h3 {
}


/*email setup */
.emailsetup {
    background:url(/images/icons.gif) no-repeat top left;
    background-position:0 -450px;
    height:48px;
    margin:5px 10px;
    padding:0 0 0 60px;
}

#emailsetup {
    padding:0;
    margin:0;
}


#emailsetup li {
    list-style-type:none;
    border-bottom:solid 1px #efefef;
    padding:13px 0 15px 0;
    background:url(../m/images/right-arrow.png) no-repeat scroll 99% 50%;
}


#emailsetup a {
    text-decoration:none;
    color:#000;
    margin:0 0 0 10px;
}

.centre {
    margin:5px 0 0 70px;
}

.hs_text {
	margin:0 10px;
	font-size:1em;
}

/*products*/
.products {
	background:url(/images/icons.gif) no-repeat top left;
    background-position:0 -150px;
    height:48px;
    padding:0 0 0 60px;
	margin:10px 10px !important;
}

#products {
	margin:0;
	padding:0;
	font-weight:normal;
}

#products h4 {
    font-weight:bold;
    color:#ff5800;
    margin:0px 0 10px 0px;
}

#products ul {
  list-style-type: none;
  overflow: auto;
  margin:0 0 0 10px;
}

#products li {
    border-bottom:solid 1px #efefef;
	display:block;
	padding:0 0px 10px 0px;
}

#products ul li a {
	font-size:0.9em;
	font-weight:normal;
}

#products a {
	color:#ff5800;
}

#products p {
	margin:0 40px 0 0px !important;
}


.aboutus {
	background:url(/images/icons.gif) no-repeat;
	background-position:0 -350px;
	height:48px;
	padding:0 0 0 60px;
	margin:10px 10px !important; 
	font-weight:bold;
}

.iihelp {
	background:url(/images/icons.gif) no-repeat;
	background-position:0 -600px;
	height:48px;
	padding:0 0 0 60px;
	margin:10px 10px !important; 
	font-weight:bold;
}

.status {
	background:url(/images/icons.gif) no-repeat;
	background-position:0 -654px;
	height:48px;
	padding:0 0 0 60px;
	margin:10px 10px !important; 
	font-weight:bold;
}

.coffeecam {
	background:url(/images/icons.gif) no-repeat;
    background-position:0 -500px;
    height:48px;
    padding:0 0 0 60px;
    margin:10px !important;
    font-weight:bold;
	line-height:20px;
}

.sitemap {
	height:48px;
	padding:0 0 0 60px;
	margin:10px 10px !important; 
	font-weight:bold;
}

/************ VOLUME-USAGE STYLES ************/


/* added by hj for volumeusage. I've overridden some of their styles, for obvious reasons. some px-specific declarations in there, i'll go through and fix that once we get an endgame stylesheet from them. they don't employ the 'body %' hack to make ems more usable, which is a bummer, and that'd be silly to override .. meh */

table	{
	width: 96%;
	font-size:0.8em;
	margin:0 0 0 5px;
}

th{
	border-bottom: 1px solid #ccc;
	text-align: left;
	padding: 5px 0 0 0;
}

.tdindent {
	text-align:left;
	padding:0 0 0 20px;
}

#date_select	{
	margin: 10px auto 20px 0px;
}

div.progress-container {
	border: 1px solid #aaa; 
	width: 95%; 
	margin: 0px 5px 15px 5px; 
	padding: 1px; 
	float: left; 
	background: white;
}

div.progress-container > div {
	background-color: black; 
	height: 12px;
}

.usage_table	{
	width: 96%;
	margin: 0 0 0 0;
}

.usage_table td	{
	font-size: 0.8em;
	font-weight:bold;
}

.left_text	{
	float:left;
	font-size: 0.8em;
	font-weight:bold;
	margin: 0 0 5px 5px;
}

.right_text	{
	float:right;
	font-size: 0.8em;
	font-weight:bold;
	margin:0 5px 0 0;
}

.otrack {
	position: absolute;
	right: 0px;
	bottom: 0px;
}