﻿/*
----- Huddle screen stylesheet -----
----- 2008 -----
----- enjoy. -----

----- Background Colours -----

Body Blue: #247bb3
Footer Blue: #1f6997
Button Orange: #ff9407
Button Blue: #2c9fdb

----- Text Colours -----

Main Heading: #669ed6
Main Body: #999
Dark Body: #666
Inline Link: #669ed6
Inline Link Hover: #ff9407

----- Dimensions -----

Site Width: 968px

*/

* {
padding: 0; /* global margin and padding reset */
margin: 0;
}

.productContent
{
	text-align : left;
	margin-top:0;
}
	

/* ----- tags ----- */

a img {
border: none;}

em {
font-style: normal;
background: #efefef;}

ul {
list-style: none;}

hr {
border: none;
height: 2px;
background: #efefef;}

strong {
font-weight: bold;}

/* ----- universal styles ----- */
.hide {
display: none;}

.left {
float: left;}

.right {
float: right;}

.badge {
float: right;
margin: 0 0 20px 20px;}

.yellow {
color:#ff9407;}

img.frame {
border: 1px solid #ddd;
padding: 1px;
vertical-align: bottom;}

img.left {
margin: 0 20px 20px 0;}

img.right {
margin: 0 0 20px 20px;}


/* Enterprise solutions page */
#contact-form3 {
float:right;
margin-left:15px;
width:305px;}

#col-main-pad .clients {
background:#FFF url(../images/clients_bg.gif) repeat-x top; 
margin: 10px 0; 
width:704px;}

#sidegreytop {
height:15px;
font-size:0;
background:url(../images/sidegrey_top.gif) no-repeat top;
padding:0;}

#sidegrey {
background:url(../images/bkgd_sidegrey.gif) no-repeat bottom;
padding:0 15px 15px 15px;
font-size:12px;}

#sidegrey h2{
margin:0;
font-size: 20px;
color:#FFF;}

#sidegrey p.sidegrey-text {
margin: 5px 0;}



/* New enterprise landing page */
#slides {
position: relative !important;}

#slides p {
margin-bottom: 8px;}

#col-main #slides ul {
margin: 20px 0 10px;
padding: 0;
width: 704px;
min-height: 256px;
height: auto !important;
height: 256px;
list-style-type: none;
list-style-image: none;}

.js #col-main #slides ul {
background: transparent url(../images/slider.png) no-repeat;}
border: 5px solid #f00 !important;
height: 1%;}

.js #col-main #slides ul ul {
background: url(../images/bullet_group2.gif) no-repeat left 4px;}

#slides li.slides-item {
color: #fff;
padding: 25px 400px 0 25px;
margin: 0 0 20px 0;
font-size: 0.95em;
font-weight: normal;
position: relative;
min-height: 211px;
background: url(../images/slider.png) no-repeat;}

.js #slides li.slides-item {
background-color: transparent !important;
background-image: none;
width: 279px;
font-size: 0.9em;}

#slides li.slides-item ul {
min-height: 0 !important;
height: auto !important;
margin: 15px 0 5px !important;
background: none !important;
width: auto !important;}

#slides li.slides-item ul li {
margin-bottom: 8px !important;}

#slides li.slides-item img {
position: absolute;
right: 38px;
top: 1px;
width: 341px;
height: 233px;}

#slides .button-next,
#slides .button-prev {
position: absolute;
right: -10px;
top: 0;
cursor: pointer;
width: 37px;
height: 117px;
display: none;
text-indent: -9999px;
z-index: 5;
text-decoration: none !important;}

* html #slides .button-next,
* html #slides .button-prev {
right: 10px;}

.js #slides .button-next,
.js #slides .button-prev {
display: block;}

#slides .button-next:hover,
#slides .button-prev:hover {
background-position: left -118px;}

#slides .button-next {
background: url(../images/button-next.png) no-repeat;}

#slides .button-prev {
top: 118px;
background: url(../images/button-prev.png) no-repeat;}

#slides span.disabled,
#slides span.disabled:hover {
background-position: 0 -236px;
cursor: default;}

#slides .slides-item .button-next,
#slides .slides-item .button {
background: url(../images/slider-btn-right.png) no-repeat right center;
position: static;
height: auto;
width: auto;
display: none;
margin: 10px 0;
text-indent: 0;
text-decoration: none !important;}

#slides .slides-item .button-next:hover,
#slides .slides-item .button:hover {
background-position: right center;}

.js #slides .slides-item .button-next,
.js #slides .slides-item .button {
display: inline-block;}

#slides .slides-item .button-next span,
#slides .slides-item .button span {
background: url(../images/slider-btn-left.png) no-repeat left center;
font-size: 1.3em;
color: #fff;
font-weight: bold;
padding: 8px;
display: block;}

#slides .slides-item .button-next span:hover,
#slides .slides-item .button span:hover {
background-position: left center;}

#content .enterprise-landing h2 {
color: #669ED6;
font-size: 1.8em;}

#schedule-demo {
background: #E7F2FD url(../images/form-demo-bg.gif) no-repeat 0 bottom;
margin: 20px 0 40px;
float: left;
width: 349px;}

#schedule-demo fieldset {
background: url(../images/form-demo-top.gif) no-repeat;
margin: 0;
padding: 0 0 15px;
border: 0;}

#schedule-demo fieldset legend {
display: none;}

#schedule-demo fieldset .required-fields {
display: block;
background: url(../images/form-demo-titletop.gif) no-repeat;
padding: 5px 10px;
margin-bottom: 10px;}

#schedule-demo fieldset label {
display: inline-block;
float: left;
margin: 10px 5px 10px 30px;
width: 90px;
font-weight: bold;}

#schedule-demo fieldset input {
margin: 9px 0;
padding: 3px;
width: 184px;
float: left;}

#schedule-demo fieldset input.button {
margin: 4px 0 0 125px;
padding: 0;
width: auto;}

#schedule-demo fieldset br {
clear: both;
font-size: 0;
line-height: 0;}

#col-main .enterprise-landing .highlight {
background-color: #ff9;
display: inline-block;
padding: 2px 4px;}

/* --------------------------------------------- */
/* TOUR
/* --------------------------------------------- */
#tour {
width: 900px;
margin: 20px auto;
position: relative;}

#tour h1,
#tour h2 {
color: #669ED6;
font-weight: normal;
line-height: 2.15;}

#tour h2 {
font-size: 1.6em;
margin-bottom: 10px;}

.js #tour h1 {
text-align: center;}

#tour ul {
line-height: 1.5;}

#tour .slides-buttons {
position: absolute;
top: 0;
width: 900px;
z-index: 100;}

/* --------------------------------------------- */
/* TOUR > SLIDESHOW
/* --------------------------------------------- */
#tour .slides {
width: 900px;
overflow: hidden;}

#tour .slides ul {
width: 9999em;
overflow: hidden;
z-index: 10;
background-color: #fff;}

#tour .slides ul:after {
content: ".";
clear: both;
display: block;
font-size: 0;
height: 0;
visibility: hidden;}

#tour .slides ul ul {
width: auto;
overflow: auto;
background-color: transparent;}

#tour .slides li {
float: left;
width: 900px;}

.js #tour .slides li.slide {
height: auto !important;}

#tour .slides li li {
float: none;
width: auto;
background-color: transparent;}

/* --------------------------------------------- */
/* TOUR > SLIDESHOW > NAVIGATION
/* --------------------------------------------- */
#tour .slides-nav {
z-index: 100 !important;
position: absolute !important;
top: 273px;
left: 0;
width: 900px;
height: 110px;}

.js #tour .slides-nav div {
width: 830px;
overflow: hidden;
background: url(../images/gallery-bg.png);
margin: 0 35px;
position: relative;}

#tour .slides-nav ul {
background: url(../images/gallery-bg.png);
height: 110px;
overflow: auto;
position: relative;}

.js #tour .slides-nav ul {
background: none;
margin: 0;
overflow: hidden;}

#tour .slides-nav ul:after {
content: ".";
clear: both;
display: block;
font-size: 0;
height: 0;
visibility: hidden;}

#tour .slides-nav li {
float: left;
width: 99px;
text-align: center;
position: relative;
left: 0;}

#tour .slides-nav a {
padding: 23px 3px 13px;
color: #fff;
font-weight: bold;
display: block;
font-size: 0.9em;}

#tour .slides-nav a .overlay {
background-color: #000;
position: absolute;
top: 25px;
left: 20px;
width: 59px;
height: 45px;}

#tour .slides-nav a:hover .overlay {
display: none;}

#tour .slides-nav a .loading,
#tour .slides-nav a:hover .loading {
display: block;
background: #fff url(../images/spinner-small.gif) no-repeat center;}

#tour .slides-nav img {
vertical-align: bottom;
background-color: #fff;
padding: 2px;
margin-bottom: 5px;
-ms-interpolation-mode: bicubic;}

#tour .slides-nav .on a {
padding: 10px 0 0;}

#tour .slides-nav .on img {
width: 86px;
height: 66px;
border: 1px solid #666;
border-width: 0 1px 1px 0;}

#tour .slides-nav .on .overlay {
display: none;}

#tour .slides-nav .btn-left,
#tour .slides-nav .btn-right {
background: url(../images/sprite-buttons.png) no-repeat 0 -120px;
height: 110px;
width: 35px;
position: absolute;
top: 0;
cursor: pointer;
z-index: 10;}

* html #tour .slides-nav .btn-left,
* html #tour .slides-nav .btn-right {
background-image: url(../images/sprite-buttons-ie6.png);}

#tour .slides-nav .btn-left {
left: 0;}

#tour .slides-nav .btn-left:hover {
background-position: -45px -120px;}

#tour .slides-nav .left-disabled,
#tour .slides-nav .left-disabled:hover {
background-position: -90px -120px;
cursor: default;}

#tour .slides-nav .btn-right {
right: 0;
background-position: -135px -120px;}

#tour .slides-nav .btn-right:hover {
background-position: -180px -120px;}

#tour .slides-nav .right-disabled,
#tour .slides-nav .right-disabled:hover {
background-position: -225px -120px;
cursor: default;}

/* --------------------------------------------- */
/* TOUR > SLIDESHOW > SCREENSHOT
/* --------------------------------------------- */
#tour img.screenshot  {
vertical-align: bottom;
padding: 1px;
border: 1px solid #e7e7e7;
margin-bottom: 75px;}

/* --------------------------------------------- */
/* TOUR > SLIDESHOW > KEY
/* --------------------------------------------- */
#tour .slides .key {
margin-bottom: 30px;
margin-top: -10px;
list-style-type: none;}

#tour .slides .key li {
margin-top: 20px;
padding: 0 0 20px 40px;
position: relative;
min-height: 35px;
height: auto !important;
height: 35px;
border-bottom: 1px solid #e4e4e4;}

#tour .slides .key .bullet {
background: url(../images/ol-bullet.png) no-repeat;
display: block;
position: absolute;
left: 0;
top: 0;
width: 31px;
line-height: 31px;
color: #fff;
font-size: 1.2em;
text-align: center;}

/* --------------------------------------------- */
/* TOUR > SLIDESHOW > VIDEO TOUR
/* --------------------------------------------- */
#tour .slides .video-tour {
float: right;
border-left: 50px solid #fff;
border-bottom: 40px solid #fff;
position: relative;
z-index: 2;}

#tour .slides .frame {
background: #eee url(../images/loading-vimeo.png) no-repeat center;
border: 1px solid #ddd;
padding: 10px;
width: 400px;
height: 300px;}


/* --------------------------------------------- */
/* CONTENT > BUTTONS / BUTTON STRIP
/* --------------------------------------------- */
#content .button-strip {
overflow: hidden;
list-style-type: none !important;
list-style-image: none !important;
margin: 0 -10px 0 0;}

#content .button-strip:after {
content: ".";
clear: both;
display: block;
font-size: 0;
height: 0;
visibility: hidden;}

#content .button-strip li {
float: left;
margin: 10px 10px 10px 0;
height: 30px;
line-height: 30px;}

* html #content .button-strip li {
width: 1%;
white-space: nowrap;}

#content .button-strip .btn {
background-repeat: no-repeat;
background-position: top left;}

#content .button-strip li.right {
margin: 10px 0 10px 10px;
float: right;}

#content .button-strip .btn a {
display: block;
height: 30px;
text-indent: -9999em;
outline: none;}

#content .button-strip .more {
background-image: url(/images/buttons/btn-learnmore.gif);
width: 115px;}

#content .button-strip .demo {
background-image: url(/images/buttons/btn-arrangedemo.gif);
width: 151px;}

#content .button-strip .tour {
background-image: url(/images/buttons/btn-taketour.gif);
width: 129px;}

#content .button-strip .signup {
background-image: url(/images/buttons/btn-signupnow.gif);
width: 123px;}

#content .button-strip .bizsolutions {
background-image: url(/images/buttons/btn-bizsolutions.gif);
width: 169px;}

#content .button-strip .linkedin {
background-image: url(/images/buttons/btn-linkedin.gif);
width: 90px;}

#content .button-strip .ning {
background-image: url(/images/buttons/btn-ning.gif);
width: 63px;}

#content .button-strip .facebook {
background-image: url(/images/buttons/btn-facebook.gif);
width: 103px;}

#content .button-strip .requestcall {
background-image: url(/images/buttons/btn-requestcall.gif);
width: 137px;}
