/* -------------------------------------------------------------- 
   
   PRODUCTS CSS ROAMBI.COM
   
-------------------------------------------------------------- */


/* Layout
-------------------------------------------------------------- */

#productsContainer {
	width: 921px;
	margin: 0px 0px 0px 20px;
}

.productsBox {
	margin-left: 20px;
	padding-bottom: 45px;
	position:relative;
}


.productsBox .rule {
	border-right: #222222 solid 1px;
	padding-right: 20px;
	height: 210px;
}

.productsBox #button-register {
	width: 205px;
}

.productsBox #button-learn-pro {
	width: 100px;
}

.productsBox #button-buy-pro {
	width: 70px;
}

.productsBox #button-learn-es {
	width: 205px;
}

.productsBox .button {
	margin-top: 10px;
}


/* Comparison Chart
-------------------------------------------------------------- */

#comparisonChart {
	text-align: center;
	margin: 35px 0px;
}

#comparisonChart table td, #comparisonChart table th {
	text-align: center;
	padding: 15px 0px;
}

#comparisonChart table .featureHeader th {
	border-left-width: 0px;
	padding: 10px 0px 5px 0px;
	font-size: 1.4em;
	font-weight: bold;
}
#comparisonChart table .featureHeader .border {
	border-left: #D7D7D7 solid 1px;
}

#comparisonChart table .featureHeader a {
	outline: none;
}

#comparisonChart table {
	width: 840px;
	margin: 0 auto;
	color: #FFFFFF;
	font-size: 1.2em;
	background-color: #7A7A7A;
	border: #D7D7D7 solid 1px;
	border-bottom-width: 0px;
	border-left-width: 0px;
}

#comparisonChart table th, #comparisonChart table td {
	border-bottom: #D7D7D7 solid 1px;
	border-left: #D7D7D7 solid 1px;
	vertical-align: middle;
}

#comparisonChart thead tr {
	background-color: #343434;
}

#comparisonChart table tbody .rowHead {
	background-color: #f90040;
	font-weight: bold;
}

#comparisonChart table tbody th {
	background-color: #4d4d4d;
	text-align: left;
	padding: 10px 10px;
	text-transform: uppercase;
	font-weight: bold;
}

#comparisonChart table tfoot tr {
	background-color: #343434;
}

#comparisonChart .check {
	background: url(../img/comparisonCheckIcon.jpg) no-repeat;
	padding-left: 30px;
	padding-bottom: 30px;
	position: relative;
	bottom: .5em;
}





/*
#freeaccount {position:absolute; z-index:5; top:35px; right:5px; 
width:95px;
height:49px;
overflow:hidden; 
background:url(../img/icon-freeaccount.gif) no-repeat;
}
*/

#freeaccount {position:absolute; z-index:5; top:35px; right:5px; 
width:99px;
height:53px;
overflow:hidden; 
background:url(../img/../img/products-overview/free_account.gif) no-repeat;
}


#btn-freepublisheraccount {
margin:30px 0 0 5px;
width:252px;
height:45px;
overflow:hidden; 
text-indent:-9999em;
display:block; 
border: 0;
outline:0;
background:url(../img/btn-freepublisheraccount.gif) no-repeat;
}

/* fixes */
#button-buy-pro{ white-space: nowrap;}
#subNav {font-size:14px; }
#footer a, #footer p {font-size:13px; }
#footer ul {width:800px;}

/* new - redesign */
.pg-products-overview {background: url("../img/pro-overview/body_gradient.jpg") no-repeat scroll center 590px #0F0F0F; color:#969696; font-size:13px; }
.pg-products-overview h3 {color:#fff; font-size:20px; margin:0 0 10px 0;}
.pg-products-overview h2 {color: #FF9000; font-size:20px; margin:0 0 5px 0;}

.banner-products {background: url("../img/products-overview/main_graphics.jpg") no-repeat scroll 0 0 transparent;
    height: 187px; width:925px; margin:10px 0 40px 30px; position:relative;}

.banner-products h1 { background: url("http://assets.roambi.com/img/products-overview/roambi-logo-with-icon.png") no-repeat scroll 0 0 transparent;
    height: 39px;
    overflow: hidden;
    text-indent: -9999em;
    width: 196px;
    position:absolute; z-index:5; top:80px; left:60px;
}

.info-products { margin:10px 0 30px 0;}
.info-products .info {width:580px; float:left; margin:0 30px 0 35px; font-size:15px; border-right:1px solid #222; padding:0 20px 0 0;}
.info-products .info p {margin:0 0 10px 0;}
.info-products .product {width:290px; float:left;}
.info h2 {color:#fff; font-size:25px; font-weight:bold;}

.publishing-products {margin:0 0 0px 40px; padding-top:10px;}
.compare-products {float:left;}
.compare-products h2 {margin-left:40px;}
.compare-products a {margin-left:35px;}

.productsBox .desc {}

.webinars-products {float:left; margin:37px 0 0 20px; width:250px; padding:20px 20px 10px 25px; -moz-border-radius: 10px;  -webkit-border-radius: 10px; border:1px solid #242424;}
.btn-badge { height:52px; padding:20px 0 0 135px;  width:121px; display:block; text-align:center;
background:url(../img/enterprise-overview/btn_webinar.png) no-repeat; margin:0 0 10px -10px;}



.b-sp001 .b {width:115px; float:left; margin:15px 0;}
.b-sp001 .b-black {margin-right:10px;}
.b-sp002 {margin:15px 0;}
.b-sp003 {margin-top:15px; width:250px;}

/* new buttons */
.r {-moz-border-radius: 5px;  -webkit-border-radius: 5px;}
.b {font-size:14px; font-weight:bold; color:#fff; display:block; position:relative; text-align: center; padding:8px;line-height:20px;cursor: pointer; outline: none;
/* -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.15); -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.15); */ }
.b:focus, .b:hover, .b:active{  outline: none;color:#fff;text-decoration: none; }


/* ------------------
	BLACK BUTTON
--------------------- */
.b-black { background-color: #000000; color:#FF9000;
	background: -webkit-gradient(linear, left top, left bottom, from(#2A2A2A), to(#000000));
	background: -moz-linear-gradient(top,  #2A2A2A,  #000000);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2A2A2A', endColorstr='#000000');
}
.b-black:hover { background-color: #4C4C4C; border-color: #008AFF; color:#FF9000;
	background: -webkit-gradient(linear, left top, left bottom, from(#5A5A5A), to(#303030));
	background: -moz-linear-gradient(top,  #5F5F5F,  #383838);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5F5F5F', endColorstr='#383838');
	
	-moz-box-shadow: 0px 0px 7px #3586FF; -webkit-box-shadow: 0px 0px 7px #3586FF;
}


/* ------------------
	BLUE BUTTON
--------------------- */
.b-blue{ background-color: #0C59C1;
	background: -webkit-gradient(linear, left top, left bottom, from(#3E7DCD), to(#01357E));
	background: -moz-linear-gradient(top,  #3E7DCD,  #01357E);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3E7DCD', endColorstr='#01357E');
}
.b-blue:hover{ border-color: #FFFFFF; background-color: #3E7DCD;
	background: -webkit-gradient(linear, left top, left bottom, from(#458FEE), to(#0652B4));
	background: -moz-linear-gradient(top,  #458FEE,  #0652B4);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#458FEE', endColorstr='#0652B4');
	
	-webkit-box-shadow: 0px 0px 4px rgba(255,255,255,0.75); -moz-box-shadow: 0px 0px 4px rgba(255,255,255,0.75);
}

/* ------------------
	GREEN BUTTON
--------------------- */
.b-green { background-color: #7BB52B; 
	background: -webkit-gradient(linear, left top, left bottom, from(#92CC39), to(#246501));
	background: -moz-linear-gradient(top,  #92CC39,  #246501);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#92CC39', endColorstr='#246501');
}
.b-green:hover { border-color: #FFFFFF; background-color: #4AB212;
	background: -webkit-gradient(linear, left top, left bottom, from(#92CC39), to(#2F8600));
	background: -moz-linear-gradient(top,  #92CC39,  #2F8600);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#92CC39', endColorstr='#2F8600');
	
	-webkit-box-shadow: 0px 0px 4px rgba(255,255,255,0.75); -moz-box-shadow: 0px 0px 4px rgba(255,255,255,0.75);
}

/* ------------
	SUB NAV
-----------------*/

.link-back-2 {
	color: #969696 !important;
	float:left;
	display: block;
	font-size:13px;
	font-weight:normal;
	margin: 10px 0 25px;
}

.link-back {
	color: #969696 !important;
	display: block;
	font-size:13px;
	font-weight:normal;
	margin: 10px 0 25px 70px;
}

.link-back-3 {
    background: url("http://assets.roambi.com/img/back-arrow.png") no-repeat scroll 7px 8px transparent;
    border: 1px solid #222222;
    -webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px; 
    color: #888888 !important;
    display: block;
    float: left;
    font-size: 11px;
    font-weight: normal;
    margin: 0 0 25px;
    padding: 5px 5px 5px 19px;
}

.link-back-3:hover {
    border: 1px solid #666666;
    color: #888888 !important;
    text-decoration: none;
}
.link-back-3:active, .link-back-3:focus {
    border: 1px solid #FFFFFF;
    color: #888888 !important;
    text-decoration: none;
}