html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
/*...................... Media Surgery ............................
COLOURS:
Dark Blue : #565281
Light Blue: #50bacd
*/
body { font-size: 75%; font-family: Tahoma, Arial, Helvetica, sans-serif; background:url(/images2010/bg-inner.png) 0 0 repeat-x; }
.body-home { background:url(/images2010/bg.png) 50% 0 no-repeat; min-height: 900px;}
#wrapper { width:960px; margin:0 auto; position: relative;}
#topper { height:300px; position:relative; }
#home-main:after,
#topper:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#logo { float: left; height: 110px; }
a:link, a:visited { color:#666; }
a img { border:none; }
p { padding:0.7em 0 0 0; line-height: 1.5em; color: #6b6a6a; }
li { line-height: 1.5em; color: #6b6a6a; }
/*....................... Nav ......................................... */
#nav { float: right; width: 500px; }
#nav li { width: 85px; margin-right: 14px; float: left; padding: 45px 0 15px; text-align: center;}
#nav li.selected { background: url(../images2010/sprites.png); }
#nav a { color: black; text-decoration: none; font-size: 1.2em;}
/*....................... Home Page ......................................... */
.body-home h1 { background: url(../images2010/h1-ngage.png) 0 25px no-repeat; font-size: 2.1em; padding: 40px 0 0 170px; clear: both; margin-bottom: 30px;}
#overview { float:left; width: 420px; margin-top: 280px;}
/*#overview { position: absolute; top: 100px;right: 0; width: 960px; } */
#overview h2 { background: url(/images2010/ngage-for-sharepoint.png) 100% 0 no-repeat; height: 64px; text-indent: -9999px; }
#overview blockquote { font-family: arial, sans-serif; color: #9c9c9c; font-size: 1.3em; line-height: 1.3em; margin-top: 5px; padding-left: 61px;}
#overview p { margin-top: -20px; }
#products { margin: 40px 0 0 0; width: 488px; clear: both; float: left; position: relative; z-index: 101;}
#products li { margin: 0 0 10px 0;position: relative; width: 488px; display: block; }
#products li a { background: url(../images2010/sprites.png) 0 -79px; height: 101px; display: block; text-indent: -9999px; }
#products li#p-advances a { background-position: 0 -185px; }
#products li#p-ngage a { background-position: 0 -290px; }
#products li span { position: absolute; right: -220px; top: -55px; display: block; width: 130px; height: 168px; padding: 20px 20px 20px 30px; display: none;
background: url(/images2010/rollover.png) 0 0 no-repeat;}
#products li#p-advances span span { height: 30px;}
#products li span span { display: block; position: relative; left: -10px; top: 0; padding: 0; height: 50px; width: 180px;
background: url(/images2010/sprites.png) -180px -448px; }
#products li#p-advances span span { background-position: -180px -503px; }
#products li#p-ngage span span { background-position: -180px -393px; }
#home-blocks { width: 960px; }
#home-blocks-left { float: left; width: 480px; }
#home-blocks-right { float: left; width: 460px; }
#home-blocks #what-is { width: 420px; padding: 30px 30px 40px 30px; margin: 50px 0 40px 0; float: left; }
#home-blocks #webinar { clear:left; margin-left: 0; padding-bottom: 50px; }
#home-blocks h2 { background: url(/images2010/dotted.png) 0 100% repeat-x; padding-bottom: 3px; font-size: 1.3em;}
#home-blocks div div { background: url(/images2010/80-percent.png); padding: 30px; margin-left: 40px; margin-bottom: 20px;}
#what-is h2 { margin-bottom: 10px; }
#what-is p,
#what-is li { font-size: 1.1em;}
#what-is li { padding: 10px 0 10px 15px; margin-left: 15px; list-style: disc;}
#what-is ul { padding: 20px 0 40px 0; }
#home-blocks #shout-box { margin-top: 50px; padding-left: 25px; margin-bottom: 38px; }
#home-blocks #shout-box img { padding: 40px 0 0 68px; }
#home-blocks #shout-box img { margin:-30px 0 0 -30px; }
#home-blocks a.more { background:#37b2c6 url(/images2010/arrow.png) 98% 2px no-repeat; float: right; margin-top: 10px; padding: 4px 24px 4px 10px; color: white; text-decoration: none;}
#home-blocks #latest-news-home { clear: none; margin-top: 10px;}
#home-blocks #latest-news-home h2 { padding-top: 0 ;}
#latest-news-home li { background: url(/images2010/dotted.png) 0 100% repeat-x; padding: 5px 0; display: block; float: left; width: 100%;}
#latest-news-home li span { float: left; width: 120px; }
#latest-news-home li a { float: left; width: 240px; }
#latest-news-home:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#latest-news-home p span { position: absolute; top: 74px; left:0; font-style: italic;}
/*....................... Inner Pages ......................................*/
#breadcrumb { margin: 20px 0 60px 0; padding: 0 0 18px; background: url(/images2010/dotted.png) 0 100% repeat-x; clear: both; float: left; width: 960px; }
#breadcrumb li { float: left; padding-left: 10px; background: none; padding-top: 0; }
#breadcrumb li:first-child { padding-left: 0; }
#breadcrumb li a { padding:5px 30px 0 0; color: #565281; display: block; font-size: 1.2em; float: left; text-decoration: none;
background: url(/images2010/crumb.png) 100% 9px no-repeat; }
#breadcrumb li span { display: block; padding: 5px 0 0 10px; float: left; color: #50bacd;}
#breadcrumb:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.carousel-wrapper { float: right; width: 589px;}
.carousel-control { float: left; background: url(/images2010/sprites.png) -533px 0px; width: 52px; height: 52px; margin-top: 100px; text-indent: -9999px; }
.carousel-next { float: left; background: url(/images2010/sprites.png) -533px -57px; }
.carousel-wrap { border:10px solid #50bacd; display:inline-block; padding: 10px 10px 10px 0; margin:0; height: 230px !important; vertical-align:middle; width:445px; float: left; }
.js { overflow:hidden;zoom:1;}
.IE .js .carousel-wrap { display:inline;}
.js ul li { overflow:hidden;float:left; width:455px; height:250px; text-align:center; }
/*................... Latest News .......................*/
#latest-news { margin: 40px 0; clear: both; float: left;}
#latest-news h1 { font-size: 2.8em; padding-bottom: 5px; clear: both; margin-left: 160px; width: 760px;}
#latest-news h2,
#latest-news-inner h2 { padding: 25px 0 0 0; font-size: 1.3em;}
#latest-news-inner { position: relative; width: 960px; padding-bottom: 20px; background: url(/images2010/dotted.png) 0 100% repeat-x;}
#latest-news-inner h2 a { color:#50bacd; }
#latest-news-inner p { font-size: 1.2em; }
#latest-news-inner li { font-size: 1.2em; padding: 10px 0 10px 40px; list-style: circle;}
#latest-news h2#h2-topper { font-size: 1.4em; line-height: 1.5em; color:#50bacd;}
#latest-news p,
#latest-news h2,
#latest-news ul { margin-left:160px !important; width: 760px; }
#latest-news ul { margin: 10px 0 20px 0; }
#latest-news ul li { margin-left: 40px; padding: 10px 0 10px 40px; font-size: 1.2em; list-style: circle; }
#latest-news #paginate { clear: both; margin: 0; background-color: #f1f1f1; margin-top: 20px; padding: 20px; float: left; width: 760px;}
#latest- news #paginate a,
#latest- news #paginate strong { float: left; padding: 5px; width: 15px;}
#latest-news p { font-size: 1.2em;}
/*................... Latest News Inner .......................*/
#latest-news-inner { margin: 40px 0 40px 0; clear: both; float: left;}
#latest-news-inner h1 { color: #50bacd; font-size: 1.6em; }
#latest-news-inner #h2-topper{ color: #565281; font-size: 1.3em; margin: 20px 0; line-height: 1.4em; }
#pr-contact h2 { font-size: 1.3em; margin: 20px 0 10px 0; }
.back-to { display: block; margin: 20px 0; }
/*......................... Product Pages ..................*/
.products { margin-bottom: 30px; }
.products .buttons { background: url(../images2010/sprites.png) 0 -79px; height: 97px; display: block; text-indent: -9999px; margin-top: 40px; }
.products #ngage-prime { background-position: 0 -185px; }
.products #ngage-35 { background-position: 0 -290px; }
#product-content { padding: 80px 0 80px 0; float: left; margin-top: -20px; width: 960px; margin: 0 auto; }
.ngage-prime #product-content { background: url(../images2010/sub-logo-prime.png) 0 0 no-repeat;}
.ngage-advances #product-content{ background: url(../images2010/sub-logo-advances.png) 0 0 no-repeat;}
.ngage-35 #product-content { background: url(../images2010/sub-logo-3.5.png) 0 0 no-repeat;}
#product-content h2 { margin-top: 30px; font-size: 1.3em; }
#product-content li { padding: 6px 0 6px 20px; list-style: disc; font-size: 1.3em; margin-left: 40px; }
#produc t-content img { float: right;}
.inner { background: url(/images2010/dotted.png) 0 0 repeat-x; clear: both; margin-top: 30px; float: left; width: 100%; }
#inner-topper p { font-size: 1.3em; margin-right: 80px; float: left; width: 400px; margin: 15px 0;}
#sub-nav { width: 250px; padding: 35px; background-color: #f3f3f5; float: left;}
#sub-nav h2 { color: #565281; background: url(/images2010/dotted.png) 0 100% repeat-x; padding-bottom: 3px; font-size: 1.4em; margin-bottom: 20px;}
#sub-nav li { padding: 10px 0; background: url(/images2010/dotted.png) 0 100% repeat-x;}
#sub-nav li a { color: #565281; text-decoration: none;}
#sub-nav li.here a { color: #50bacd; background: url(/images2010/sub-nav-selected.png) 0 2px no-repeat; padding-left: 35px;}
video,
#video_jwplayer { float: right; border:10px solid #50bacd; }
#video_displayIcon { display: none; }
#demo { width: 300px; height: 50px; margin: 20px 0; background: url(../images2010/sprites.png) -220px 0; display: block; clear: both; float: right; text-indent: -9999px; }
.inner h1 { background: url(/images2010/dotted.png) 0 100% repeat-x; color: #50bacd; font-size: 1.7em; clear: both; padding-bottom: 4px; }
.inner p { color: #999; font-size: 1.2em;}
.inner h1#top { text-indent: -9999px; }
#content { width:500px; margin:30px 0 65px 100px; float:left; }
#content a { padding:2px; }
#content p { color:#999; line-height:1.5em; }
#content h1 { color:#666; font-size:1.4em; padding:6px 0; }
#content h2 { padding:5px 0; }
#content h2 { font-size:1.2em; }
/*................... Partners ...........................*/
.partner { margin-top: 30px;}
.partner img { float: right; }
/*......................... Contact Us ............................*/
#contact { clear: both; margin: 20px 0 30px 0; float: left; width: 580px;}
#contact label { width: 100px; clear: both; float: left; padding-top: 3px; font-size: 1.1em; }
#contact input { width: 200px; float: left; margin-right: 40px; border: 1px solid #50bacd; padding: 5px; margin-bottom: 20px; }
#contact input:focus,
#contact textarea:focus { border-color: black;}
#contact h1 { background: url(/images2010/dotted.png) 0 100% repeat-x; font-size: 2.1em; padding: 40px 0 5px 0; margin-bottom: 30px; clear: both;}
#contact-details h1 { clear: both;}
#l-message { clear: both; }
#contact textarea { width: 453px; height: 200px; float: left; border: 1px solid #50bacd; padding: 5px; margin-bottom: 10px;}
#contact #submit { clear:both; float: left; width: 100px; background-color: #50bacd; padding: 20px; margin:20px 0 0 100px; }
#contact-details { float: left; width: 300px; margin: 111px 0 0 50px;}
/*.......................... nGage 3.5 Carousel ......................*/
#kf-content h1 { font-size:1.6em; margin:0 0 25px 15px; padding: 40px 0 10px 0; color:#038cd3; width: 960px; }
.panel .kf-rhs { float:left; width:300px; margin-left:40px; }
#kf-content h2 { margin:25px 0 5px 0; color:#000; border-bottom:3px solid #038cd3; padding-bottom:5px;}
#kf-content .slider-c-right { color:000; font-size:1.3em; color:#000; }
#kf-content p { font-size: 1.1em; }
#kf-content img { float: left; }
#kf-content li { padding: 0 !important; margin: 0 10px 0 0 !important; font-size: 1em !important; }
#kf-content .panel h1 { width: auto; padding: 0;}
#s-nav-1 { background:#fff url(/images/s-nav-1.gif) 0 100% no-repeat; }
#s-nav-2 { background:#fff url(/images/s-nav-2.gif) 0 100% no-repeat; }
#s-nav-3 { background:#fff url(/images/s-nav-3.gif) 0 100% no-repeat; }
#s-nav-4 { background:#fff url(/images/s-nav-4.gif) 0 100% no-repeat; }
#s-nav-5 { background:#fff url(/images/s-nav-5.gif) 0 100% no-repeat; }
#s-nav-6 { background:#fff url(/images/s-nav-6.gif) 0 100% no-repeat; }
#s-nav-7 { background:#fff url(/images/s-nav-7.gif) 0 100% no-repeat; }
ul.navigation a.selected { background:#FFFFFF url(/images/slider-nav-back.jpg) no-repeat scroll 8px 0 !important; }
ul.navigation a { padding:0 0 0 10px ; }
/*........................... Footer .....................................*/
#footer { clear:both; min-height:90px; margin-top: 30px; padding: 20px 0 0 0; text-align: center; border-top: 6px solid #e4e4e7; position: relative; }
.twitter-share-button { position: absolute; left: 48%; top: -30px;}