/* ivan */
body{ 
background: #0f0f0f;
}

#bd {
width:974px;
margin:0 auto;
}

#primary {
width: 385px;
float:left;
margin:40px 30px 40px 0;
}

#secondary {
width: 555px;
float:left;
margin-top:40px;
}


/* module videos
***********************************/
#mod_videos .item {
	border-bottom:1px solid #1e1e1e;
	overflow:hidden;
	padding-bottom:20px;
	margin:5px 0 0 0;
}

#mod_videos .item:first-child {
border-top:1px solid #1e1e1e;
padding-top:15px;
}

#mod_videos a{ 
float:left;
font-size:17px;
font-weight: bold;
width: 200px;
margin-top: .75em;
}


.video_thumbs {
float:left;
margin:0 20px 0 0;
background: url(../img/roambi_on_ipad/video_thumbs.gif) no-repeat;
width:102px;
height:65px;
overflow: hidden;
text-indent: -9999em;
}

.video_thumbs:hover { 
cursor: pointer !important;
/* background-position: 0 -65px;  */
}  


/* module info
***********************************/
#mod_info {
margin:0 0 50px 0;
}

#mod_info h1 {
	background: url(../img/roambi_on_ipad/hdr_main.gif) no-repeat;
	width:353px;
	height:72px;
	overflow: hidden;
	text-indent: -9999em;
	margin-bottom:20px;
	}
	
#mod_info h3 {
	color:#fff;
	font-size:17px;
	font-weight:bold;
	margin-bottom:20px;
}

/* link to learn more */
.btn.learn {
background:url("../img/roambi_on_ipad/btn_learn.gif") no-repeat;
height:54px;
width:367px;
margin:40px 0 20px 0;
}

/* module sub_nav
***********************************/
#mod_sub_nav { 
position:relative;
height:75px;
}

#sub_nav {
float:right;
margin:30px 0 0 0;
padding-right:160px;
}

#sub_nav li{
list-style-type: none;
display: inline;
float:left;
margin-right:20px;

color:#fff;
font-size:14px;
font-weight:bold;
}
#sub_nav a:hover {text-decoration: none;}

/* appStore img */
.btn.appStore {
background:url("../img/availAppStore.jpg") no-repeat;
height:74px;
width:166px;
position:absolute; z-index:5; top:0; right:0;
}

li.icn_appStore {text-indent: -9999em;}


/* footer
***********************************/
#footer {
margin-top:60px;
clear:both;
}


/* helper classes
***********************************/

.btn{
margin:0;
padding:0;
display:block; 
overflow:hidden; 
text-indent:-9999em;
border: 0;
outline:0;
}

/* clearfix */
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
	
	
/* modules */
.channel {margin:0 0 10px 0;}
.item {padding:10px; margin:0 0 10px 0;}


/* paragraph */
p {
color:#969696;
font-size:1.4em;
margin-bottom:15px;
}






/*===
    CAROUSEL 
===*/
#mod_ipad {
width:552px;
height:748px;
background:url("http://assets.roambi.com/img/features/ipad-frame.jpg") no-repeat;
position:relative;
}


.jcarousel-skin-tango {padding:50px 0 0 43px;}



.jcarousel-container {
position: relative;

border: solid 2px #424242; 
background: #000;
}
.jcarousel-clip {z-index: 2; padding: 0; margin: 0;overflow: hidden; position: relative;}
.jcarousel-list { z-index: 1;overflow: hidden;position: relative;top: 0; left: 0; margin: 0; padding: 0;}
.jcarousel-list li,
.jcarousel-item {float: left;list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px;
    height: 75px;
    
}

.jcarousel-next {z-index: 3;display: none;}
.jcarousel-prev { z-index: 3;display: none;}

.jcarousel-skin-tango .jcarousel-container-horizontal {width: 433px;padding:0px;margin-left:5px;}
.jcarousel-skin-tango .jcarousel-clip-horizontal { width:  433px;height: 580px; }
.jcarousel-skin-tango .jcarousel-item {width: 435px; height: 580px;}
.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 10px;}
.jcarousel-skin-tango .jcarousel-item-placeholder {background: #fff;color: #000;}

.jcarousel-control {position:absolute; z-index:100; top:703px; left:210px;}
.jcarousel-control {height:10px; }
.jcarousel-control a {display:block; float:left; margin-left:8px; width:10px; height:10px; text-indent:-9999em; border:0; outline:0; background:url(../img/roambi_on_ipad/activeLink.gif) 0px 0px no-repeat;}
.jcarousel-control a.active { background-position:0 -10px;}

.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 650px;
    right:30px;
    width: 10px;
    height: 13px;
    cursor: pointer;
    background: transparent url(../img/roambi_on_ipad/btn_carousel.gif) no-repeat -10px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position:  -10px -13px;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position:  -10px -13px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position:  -10px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 650px;
    left: 30px;
    width: 10px;
    height: 13px;
    cursor: pointer;
    background: transparent url(../img/roambi_on_ipad/btn_carousel.gif) no-repeat 0 0px;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position:  0px -13px;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position:  0px -13px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: 0 0;
}