* {margin: 0; padding: 0;}

body { font-size: 62.5%; color: #333; font-family: arial, helvetica, verdana, sans-serif; background: #e4e4e4 url(../images/bg_body.gif) top repeat-x; }

img { border: 0; }
sup { vertical-align: 0.6ex; }
ul, ol { list-style: none; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }

::selection { background: #efefef; color: #333; } /* Safari and Opera */
::-moz-selection { background: #efefef; color: #333; } /* Firefox */

#wrapper { margin: 0 auto; width: 760px; overflow: hidden;}

#header { width: 760px; overflow: hidden; background: url(../images/bg_header.jpg) top left no-repeat; padding: 24px 0 25px 0; margin-bottom: 15px;}
#header h1 { float: right; display: block; width: 152px; height: 33px; background: url(../images/logo-blackberry.gif) no-repeat; text-indent: -999999em; margin: 0 14px 54px 0;}
#header h2, #header h3, #header h4 { background: #e20074; float: right; clear: both; color: #fff; font-weight: normal; font-size: 2em; padding: 10px 13px 5px 13px; width: 272px; margin-right: 91px; display: inline;}

#header h3 { font-size: 1.4em;}
#header h4 { font-size: 1.4em; margin-bottom: 10px; padding: 5px 13px 10px 13px;}

#header p { background: #e20074; float: right; clear: both; color: #fff; font-size: 1.2em; padding: 10px 13px; width: 272px; margin: 0 91px 10px 0;  display: inline;}
#header p a { color: #fff; text-decoration: none; padding-left: 10px; background: url(../images/link-arrow.gif) 0 0 no-repeat; }

#video { margin-bottom: 15px; }

.cta { padding-bottom: 10px; float: left; }
.cta h3 { background: #b12e6d; padding: 14px 0 9px 17px; clear: both; color: #fff; font-size: 1.7em; font-weight: normal; margin-bottom: 12px;}
.cta p, .cta h4 { margin: 0 12px 10px 17px; font-size: 1.2em; }
.cta h4 { color: #2d757e; padding-bottom: 10px; border-bottom: 1px dotted #999999; font-size: 2.3em; font-weight: normal;}

.cta a.requestCallback { color: #ffffff; background: url(../images/callback_right.gif) top right no-repeat; display: block; float: left;  }
.cta a.requestCallback span { display: block; float: left; font-weight: normal; background: url(../images/callback_left.gif) top left no-repeat; padding: 5px 15px;}
#main .cta a.requestCallback { margin-bottom: 15px;}

.content { width: 760px; float: left; clear: both;}
.content p { font-size: 1.2em;}
.content p.note { font-size: 1.0em; clear: both; float: left; margin: 5px 0; width: 760px; }
.content p.note a { color: #000;}

#main { width: 500px; float: left; } 
#main .cta { background: #fff url(../images/bg_cta_main.gif) bottom no-repeat; position: relative; padding-bottom: 25px;}
#main .cta h3 { background: #b12e6d url(../images/hd_cta_main.gif) top left no-repeat; }
#main .cta #devices { position: absolute; bottom: 0; right: 10px; display: inline; }
#main .cta p { margin-right: 264px; }

#videoContent .cta { float: left; }
#videoContent .cta h3 { padding: 10px 0 9px 19px; clear: both; color: #fff; font-size: 1.7em; font-weight: normal; margin: 0;}
#videoContent .cta p { margin: 0 12px 10px 0; float: right; display: inline; width: 420px;}
#videoContent h2 { color: #e20074; font-size: 2.6em; font-weight: normal; margin-bottom: 20px; }
#videoContent img.handset { margin: 0 0 0 17px; float: left; }


.info { width: 500px;}
.info h2 { color: #e20074; font-size: 2.6em; font-weight: normal; margin-bottom: 20px; }
.info h2 sup { font-size: 0.5em; vertical-align: 1.5ex;}
.info h3 { font-size: 1.2em;}

.info img.banner { margin-bottom: 15px; }

.info .header { border-bottom: 1px dotted #999999; width: 500px; float: left; margin-bottom: 15px;}
.info .header li { display: block; float: left; }
.info .header li.link { float: right;}

.info .header li h3 { font-size: 1.4em; }
.info .header li a { font-size: 1.2em; line-height: 1.4em; text-decoration: none; color: #e20074; font-weight: bold; background: url(../images/arrow_mag.gif) 0 3px no-repeat; padding-left: 10px;}

.info h4 { color: #333; font-size: 1.4em; } 
.info p { font-size: 1.2em; color: #666666; margin-bottom: 10px; } 
.info .article { width: 500px; float: left; margin-bottom: 25px;}
.info .article a.readMore { color: #000; padding-left: 10px; background: url(../images/arrow_mag.gif) 0 3px no-repeat;}

.info a.btnBuy { display: block; float: left; width: 72px; height: 27px; text-indent: -999999em; background: url(../images/btn_buy_now.gif) 0 -27px no-repeat; }
.info a.btnBuy:hover { background: url(../images/btn_buy_now.gif) 0 0 no-repeat; }

#products { width: 500px; float: left;}
#products li { float: left; border-bottom: 1px dotted #999; padding-bottom: 20px; margin-bottom: 20px;}
#products li.new { background: url(../images/eyecatcher_new.gif) top right no-repeat; }
#products li .handset { float: left; margin: 0 22px 0 17px;}
#products li .info { float: left; width: 380px; display: block;}
#products li .info h3 { font-size: 1.9em; }
#products li .info h4 { font-size: 1.8em; }

#products li .options li { margin: 0; padding: 0; border: none; display: block; float: left; background: url(../images/option_right_off.gif) right no-repeat; font-size: 1.2em; font-weight: bold; margin-right: 10px;}
#products li .options li a { display: block; padding: 5px 12px 6px 12px; background: url(../images/option_left_off.gif) left no-repeat; color: #e20074;}
#products li .options li.buy { background: url(../images/option_right_on.gif) right no-repeat;}
#products li .options li.buy a {background: url(../images/option_left_on.gif) left no-repeat; color: #fff; }



#sub { width: 240px; float: right;}
#sub .cta { background: #fff url(../images/bg_cta_sub.gif) bottom no-repeat; float: left; width: 240px;}
#sub .cta h3 { background: #b12e6d url(../images/hd_cta_sub.gif) top left no-repeat; }


#sub .more h3 { background: url(../images/hd_cta_more.gif) top left no-repeat; color: #333; border-bottom: 2px solid #2d757e;}
#sub .more h5 { float: left; font-size: 1.3em; margin-bottom: 10px; margin-left: 10px;}
#sub .more img { float: right; margin: 0 17px 0 10px;}
#sub .more li { border-bottom: 1px solid #ccc; width: 240px; float: left; padding: 0 0 10px 0; margin-bottom: 10px;}
#sub .more li ul.options { float: right; font-size: 1.2em; width: 150px;}
#sub .more li ul.options li { width: 150px; border: none; padding: 0 0 0 15px; margin: 0 0 5px 0; background: url(../images/arrow_mag.gif) 0 4px no-repeat;}
#sub .more li ul.options li a { color: #262626;}

#extra { width: 760px; float: left; margin-top: 20px; background: url(../images/bg_extra.gif) repeat-y; clear: both;}
#extra .cta { width: 240px; float: left; margin-right: 20px; background: #fff; }
#extra .cta.last { margin-right: 0;}
#extra .cta h3 { background: #458d96 url(../images/hd_cta_extra.gif) top left no-repeat; }

#extra .cta ul.options { float: left; font-size: 1.2em; width: 135px; margin-left: 17px; }
#extra .cta ul.options.type1 { margin-left: 17px; display: inline; width: 200px;}
#extra .cta ul li { display: block; float: left; width: 120px; padding-left: 15px; background: url(../images/arrow_mag.gif) 0 4px no-repeat; }
#extra .cta ul.options.type1 li { width: 185px;}
#extra .cta ul li a { color: #262626; font-size: 1.1em;}

.type2 ul.options li.buy { background: url(../images/option_right_on.gif) right no-repeat;}
.type2 ul.options li.buy a {background: url(../images/option_left_on.gif) left no-repeat; color: #fff; }

#extra .cta img { float: right; margin-right: 17px; margin-left: 10px;}
#extra .cta p { font-size: 1.4em; color: #666;}

#casestudies { width: 760px; border-bottom: 2px solid #999999; float: left;}
#casestudies thead  { background: #f2f2f2 url(../images/datatable-sprite.gif) top left no-repeat; }
#casestudies td { padding: 10px 0 10px 11px; text-align: left; font-size: 1.2em;}
#casestudies th { padding: 10px 11px; text-align: left; font-size: 1.2em; border-bottom: 2px solid #999999;}
#casestudies th#info { padding: 0; width: 12px;}

#casestudies tbody tr { background: url(../images/bg_tr.gif) bottom left repeat-x; }
#casestudies tbody tr.odd { background: #F8F8F8 url(../images/bg_tr.gif) bottom left repeat-x; }
#casestudies th#company { width: 180px;}
#casestudies th#download { width: 100px;}
#casestudies td a.download {  padding-left: 10px; background: url(../images/arrow_mag.gif) 0 4px no-repeat; color: #333;}


.infobutton { padding: 0; width: 12px; height: 12px; position: relative; }
.popup {
    position: absolute;
        
    display: none; /* keeps the popup hidden if no JS available */
}
.popup h5 { background: url(../images/bubble_top.gif) top no-repeat; padding: 5px; }
.popup p { padding: 5px; float: left;}

.info .column { width: 240px; float: left; margin-bottom: 18px;} 
.info .column img { float: left; margin-top: 5px;  }
.info .column h3 { font-size: 1.4em; color: #666; margin-bottom: 7px;  }
.info .column h4 { font-size: 1.3em; margin-bottom: 3px; color: #333; }
.info .column p { margin-bottom: 5px; }
.info .column.type1 { margin-right: 20px;}

.accord { width: 500px; float: left; list-style: none; border-bottom: 1px solid #a9a9a9;}
.accord li p strong { margin-bottom: 5px;  }
.accord li { display: block; width: 500px; float: left; background: url(../images/bg_sol_accord.gif) top left no-repeat; border-top: 2px solid #cccccc;}
.accord li.first { border: none; background: url(../images/bg_sol_accord_top.gif) top left no-repeat;}
.accord li h3 { display: block; float: left; width: 480px; padding: 8px 0 6px 20px; font-size: 1.2em; margin: 0; cursor: pointer; background: url(../images/icon_plus.gif) 480px 7px no-repeat; font-weight: normal;}
.accord li.first h3 { border-bottom: 1px solid #aaaaaa;}

.accord li.active h3 { background: url(../images/icon_minus.gif) 480px 7px no-repeat; font-weight: bold; border-bottom: 2px solid #e20074;}
.accord li.callback { background: url(../images/accord_bottom.gif) bottom left no-repeat;padding: 10px 0 20px 0; width: 500px; }

.accord li.callback h4 { color: #333333; font-weight: normal; font-size: 1.8em; margin-left: 20px; }
.accord li.callback p strong { font-size: 1.6em;}
.accord .box .column p { clear: both; display: block; float: left;}

.accord .box .type1 p, .accord .box .type2 p { width: 220px;}


.accord .box { float: left; border-bottom: 1px solid #999999; padding: 0 19px; width: 460px; border-left: 1px solid #a9a9a9; border-right: 1px solid #a9a9a9;}
.accord .box .column { width: 220px; margin: 10px 20px 0 0;}
.accord .box .type2 { margin-right: 0;}
.accord .box .extra { padding-bottom: 10px; width: 460px; float: left;}

.accord .box .details { display: block; float: left; width: 460px; margin: 10px 0; }
.accord .options li { border: none; background: transparent; display: block; float: left; width: auto; margin: 0; padding: 0; border: none; display: block; float: left; background: url(../images/option_right_off.gif) right no-repeat; font-size: 1.2em; font-weight: bold; margin-right: 5px;}
.accord .options li a { display: block; padding: 5px 12px 6px 12px; background: url(../images/option_left_off.gif) left no-repeat; color: #e20074;}

.accord .bullets { width: 220px; display: block; float: left; margin: 0; padding: 10px 0 0 0;}
.accord .bullets li {  background: url(../images/bullet.gif) 0 4px no-repeat; border: none; width: 200px; float: left; font-size: 1.2em; margin-bottom: 5px; padding-left: 15px; margin-left: 3px; color: #666;}

.accord .last .box { border-bottom: none;}

.accord .customerInfo p { margin-right: 55px;}

#solutions-accord { border-bottom: none;}

#benefits { width: 760px; float: left; background: #fff url(../images/bg_benefits_2.jpg) 0 15px no-repeat; overflow: hidden;}
#benefits.tab2 { background: #fff url(../images/bg_benefits_1.jpg) 0 15px no-repeat; }

#benefits ul.tabs { border-bottom: 2px solid #b22e6d; background: url(../images/bg_tabs.gif) bottom repeat-x; font-size: 1.4em; font-weight: bold; width: 760px; float: left; margin-bottom: 14px;}
#benefits ul.tabs li { display: block; float: left; margin-right: 5px; background: url(../images/tab_left.gif) top left no-repeat; }
#benefits ul.tabs li a { display: block; padding: 5px 20px 4px 20px; background: url(../images/tab_right.gif) top right no-repeat; color: #333333;}
#benefits ul.tabs li a:hover { text-decoration: underline; color: #e20074;}
#benefits ul.tabs li.active { background: url(../images/tab_left_active.gif) top left no-repeat; }
#benefits ul.tabs li.active a { color: #fff; background: url(../images/tab_right_active.gif) top right no-repeat;}
#benefits ul.tabs li.active a:hover { color: #fff;}

#benefits .device { float: left; width: 240px; height: 200px; padding-left: 20px; }
#benefits .device.panel2 { padding: 0; }

#benefits .accord { float: right;}
#benefits h4 { color: #666666; font-size: 1.4em; margin: 0 0 7px 267px; float: left; display: inline;}

.blackberry #main .info h3 { font-size: 1.5em;}

.tooltip-body {width: 198px; padding: 0 10px; background: #fff; }
.tooltip-body h3 { color: #e20074; font-size: 1.4em; margin-bottom: 3px;}
.tooltip-body p { font-size: 1.1em;}