/* -------------------------------------------------------------- 
   
   PRO-OVERVIEW.CSS ROAMBI-WEB
   
-------------------------------------------------------------- */
h4 {font-weight: bold;}
.button {
font-size: 18px; font-weight: bold; color: #fff; 
text-shadow: 0px -1px #333333; 
padding: 10px 30px; 
-webkit-transition: border-color 0.5s; 
border: 1px solid #37840C; 
cursor: pointer;  
-moz-border-radius: 5px; -webkit-border-radius: 5px; 
overflow: visible;
line-height:30px; 
font-weight:normal; 
background:url("../img/pro-overview/button-mid-green-large.jpg") repeat-x #256501;
}

/* splash */
#splash { position: relative; }
#splash .button {position: absolute; left: 50px; bottom: 55px; }
.button:hover { cursor: pointer; border: 1px solid #fff;  }
#splash img {margin:0 0 0 8px;}
#splash span {font-weight:bold; position:relative;margin-left:-8px;}
#splash em {
width:19px; height:19px;
display:block;
overflow: hidden;
background:url("../img/pro-overview/icn_pointer.gif") no-repeat;
position: absolute; right: -25px; top: 1px; z-index:1;
}

/* module info */
#mod_info {width:900px; -moz-border-radius: 12px; -webkit-border-radius: 12px; padding:20px; background: #191919; font-size:14px;line-height:16px;margin:0 0 40px 20px; clear:both;min-height:202px;}
#mod_info p,
#mod_info li{color:#969696; }
#mod_info h4 {color:#fff;font-size:20px;line-height:28px;}
#mod_info p,
#mod_info h4 {margin-bottom:10px;}
#mod_info li { list-style-type: disc; margin-left:30px;}

#text_two,
#text_three,
#text_four {display:none;} 

.info_text {float:left; width:575px; margin-left:10px;}
#info_nav {float:right; width:245px; font-size:13px;margin:20px 20px 0 0;}

#info_nav span {color:#fff; font-weight: bold; display:block;  padding:10px 0 10px 10px;background:url("../img/pro-overview/nav_bg.gif") repeat-x bottom left;}
#info_nav span.current {background:#333;}
#info_nav span em {background:url("../img/pro-overview/nav_pointer.gif") no-repeat center left;padding-left:15px;}
#info_nav span.current em {background:url("../img/pro-overview/nav_pointer_current.gif") no-repeat center left;}
.green {color:#60bf00;}
#info_nav span:hover {cursor:pointer;color:#FF9000 !important;}
.info_text .button {width:100px; margin:20px 0 0 20px;}
.noBgImg { background-image: none !important;}

/* module description */
#mod_desc {color:#969696;font-size:14px; margin:10px 0 30px 0; line-height:16px;}
#mod_desc h4 {color:#fff;font-size:20px;line-height:28px;margin-bottom:10px;}
#mod_desc .item {width:282px; float:left; margin:0 0 0 20px;}
#mod_desc .desc-left h4 {color:#ff7800;margin-top:15px; }
#mod_desc .desc-center h4 {color:#6eda00;margin-top:15px;}
#mod_desc .desc-right h4 {color:#0066ff; }
#mod_desc .desc-left {border-right:1px solid #252525;padding-right:10px;}
#mod_desc .desc-right { -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #000; border:1px solid #252525;padding:15px;-webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.65); -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.65);
background:#000 url("../img/pro-overview/gradient.gif") repeat-x ;} 


/* module CAROUSEL  */
#carouselify h4 {color:#fff !important; line-height:76px;margin:5px 0 10px 0;}
.icn_storage {background:url("../img/pro-overview/hdr_amazon.gif") no-repeat center right;}
.icn_transmission {background:url("../img/pro-overview/hdr_transmission.gif") no-repeat center right;}
.icn_access {background:url("../img/pro-overview/hdr_access.gif") no-repeat center right;}
.icn_device {background:url("../img/pro-overview/hdr_shield.gif") no-repeat center right;}
/*===
    CAROUSEL 
===*/
#mod_carousel {width:290px; height:260px; position:relative;margin:40px 0 0 -6px; padding:2px 0 0 3px;
-moz-border-radius: 5px; -webkit-border-radius: 5px; border:1px solid #252525; background:#000;
}

.jcarousel-container {position: relative;}
.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: 285px;padding:0px;margin-left:5px;}
.jcarousel-skin-tango .jcarousel-clip-horizontal { width:  285px;height: 220px; }
.jcarousel-skin-tango .jcarousel-item {width: 275px; height: 220px;}
.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:233px; left:100px;}
.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: 230px;
    right:20px;
    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: 230px;
    left: 10px;
    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;
}