/*
Author: Copyright (c) 2010, Bjorn Jansen
Author URI: www.gossh.com 
Version: 0.1
*/

/*
	- GENERAL
	- BASIC LAYOUT
	- SHADOWS
	- HEADINGS
	- LISTS
	- HEADER
	- MENU
	- PAGE CONTENT
	- BOXES
	- PROMOS
	- ADVERTISING
	- FOOTER
	- JQUERY
*/

/*** GENERAL ***/

/** RESET */

html, body, ul, ol, li, img, hr, input, dl, dt, dd, form {
	margin: 0px;
	padding: 0px;
	border: none;
	list-style: none;
}

/** BASIC HTML */

body{
	font-size: 62.5%;
	font-family:helvetica,arial,sans-serif;
	text-align: left;
	margin:0;
	padding:0;
	font-weight:lighter;
}

.contactInfo p{
	float:right;
	margin:0;
	color:#6f6f6f;
	font-size:12px;
	font-weight:lighter;
	padding:5px 4px 0;
	line-height:16px;
	width:110px;
}

#contactInoSubscribe.contactInfo p{
	float:right;
	margin:0;
	color:#6f6f6f;
	font-size:14px;
	font-weight:lighter;
	padding:5px 4px 0;
	line-height:16px;
	width:176px;
}


.promos p{
	color:#949393;
	font-size:1.2em;
	padding:10px 0 0;
	margin:0;
	line-height:1.3em;
}

.demos p {
	margin:0 0 4px;
	background:transparent url(../images/scroll/bullet.png) no-repeat scroll 0 2px;
	padding:2px 0 1px 22px;
}

.site p {
	font-size:11px;
	float:left;
	padding:0;
	width:130px;
}

.site img {
	float:right;
	margin:0 !important;
	margin:-10px 0 0

}

.clear{
	margin:16px 0 0;	
}

.box1 p {
	color:#949393;
	font-size:11px;
	margin:0 10px 10px 10px;
	line-height:12px;
}

.none{
	display:none;
}



/*LINKS*/

a {
text-decoration:none;
outline-color:-moz-use-text-color; 
outline-style:none; 
outline-width:0;
}

.box1 a:hover{
	background-color:#ffffff;
	opacity:.9;
}

.contactInfo a{
	color:#0088CC;
	text-decoration:none;
}

#contactInoSubscribe.contactInfo a{
	color:#0088CC;
	text-decoration:none;
	font-size:12px;
}

.contactInfo a:hover{
	color:#949393;
}

#contactInoSubscribe.contactInfo a:hover{
	color:#949393;
}


#navigation a{
	color:#9b9b9b; 
	text-decoration:none;
}

#navigation a:hover{
	color: #6B7B95;
}

#thumbs .feeds a{
	text-decoration:none;
	background:none;
	color:#6f6f6f;
	width:399px;	
}

#thumbs .feeds a:hover{
	text-decoration:none;
	background:none;
	color:#6b7b95;
	width:398px;	
}

.promos a{
	color:#6b7b95;
	text-decoration:none;
	bottom:0;
}

.promos a:hover{
	color:#949393;
}

.details .toolPromo a{
	color:#6b7b95;
	text-decoration:none;
	font-size:11px;
}

.details a {
	color:#6b7b95;
	font-size:15px;
	text-decoration:none;
	display:block;
	line-height:19px;
}

.details a:hover {
	color:#949393;
}

#footer a{
	color:#0088CC;
	text-decoration:none;
}

#footer a:hover{
	color:#999999;
}

/*IMAGES*/

.toolPromo img{
	float:left;
	border-right:1px solid #e6e6e6;
	margin:0 25px 0 0;
	padding:0 15px 0 0;
}

.toolPromo img{
	float:left;
	border-right:1px solid #e6e6e6;
	margin:0 25px 0 0;
	padding:0 15px 0 0;
}

.contentImage img{
	float:right;
}

.demos img {
	display:block;
}

.rss img{
	margin:-2px 0 0;
	border:none;
}

.facebook img{
	margin:-2px 0 0;
	border:none;
}

.google img{
	margin:-2px 0 0;
	border:none;
}

.rss span{
	display:block;
	float:left;
	padding:4px 4px 0 0;
	color:#0088CC;
}

.facebook span{
	display:block;
	float:left;
	padding:4px 4px 0 0;
	color:#0088CC;
}

.google span{
	display:block;
	float:left;
	padding:4px 4px 0 0;
	color:#0088CC;
}

.active span{
	color:#7ba2ac;
}

/** BASIC LAYOUT */

#container {
    width: 978px;
    margin: 0 auto;
} 

#wrapper {
    width: 100%;
	height:100%;
} 

#content {
	float:left;
	width:100%;	
	padding:10px 0;
	height:100%;
}

#intro{
	margin:-20px 0 0;
}

.loading{
	background: url(../images/loading.gif) no-repeat;
	margin:190px;
	position:absolute;
	padding:0;
	width:16px;
	height:11px;
	display:block;
}

.loadingOverlay{
	background: url(../images/loading.gif) no-repeat;
	margin:180px;
	position:absolute;
	padding:0;
	width:16px;
	height:11px;
	display:block;
}

/** SHADOWS */

#shadowLeft {
	height:400px;
	position:absolute;
	width:200px;	
	background: #ffffff url(../images/shadowLeft.jpg) no-repeat left top; 
}

#shadowRight {
	height:400px;
	position:absolute;
	width:145px;
	background: #ffffff url(../images/shadowRight.jpg) no-repeat left top;
	margin-left:92%;
}  

.contentShadowLeft{	
	background:transparent url(../images/contentShadow.jpg) no-repeat scroll 0 0;
	height:312px;
	margin-left:-10px;
	position:absolute;
	top:132px;
	width:280px;
}

.contentShadowRight{	
	background:transparent url(../images/contentShadowRight.jpg) no-repeat scroll 0 0;
	height:268px;
	margin-left:614px;
	position:absolute;
	top:132px;
	width:370px;
}

.shadowNav{	
	background:transparent url(../images/navShadow.jpg) no-repeat scroll 0 0;
	height:37px;
	top:0;
	width:400px;
	margin:22px 0 0;
}

/** HEADINGS */

h1{
	margin:0;
	color:#7ba2ac;
	font-size:3.5em;
	font-weight:lighter;
	padding:20px 0 4px 4px;
}

h2 {
	margin:0;
	color:#6f6f6f;
	font-size:1.6em;
	font-weight:lighter;
	padding:0 0 0 4px;
}

h3 {
	color:#6b7b95;
	font-size:1.8em;
	font-weight:lighter;
	padding:0;
	margin:0;
}

h4 {
	color:#666666;
	font-size:1.3em;
	font-weight:lighter;
	padding:2px 0 0;
	margin:0;
}

.details h1{
	color:#6b7b95;
	font-size:32px;
	padding:0;
}

.details h2{
	margin:0;
	color:#6f6f6f;
	font-size:16px;
	font-weight:lighter;
	padding:0 0 10px 1px;
	line-height:20px;
	border-bottom:1px solid #Efefef;
}

#intro .details h2{
	border:none;
}

#team .details h2{
	border:none;
}

.tool h2{
	border:none;
}

.toolPromo h1{
	margin:0;
	color:#6b7b95;
	font-size:16px;
	font-weight:lighter;
	padding:15px 0 0;
}

.toolPromo h2{
	margin:0;
	color:#6f6f6f;
	font-size:12px;
	font-weight:lighter;
	padding:10px 0 5px 0;
	line-height:16px;
}

.contactInfo h3{
	float:left;
	margin:0;
	color:#666;
	font-size:14px;
	font-weight:lighter;
	padding:6px;
	display:block;
	border-right:1px solid #E6E6E6;
	text-align:right;
}

.box1 h3{
	margin:0;
	color:#6B7B95;
	font-size:14px;
	font-weight:lighter;
	margin:0 10px 2px 10px;
}

.latestNews h3{
	border-right: 1px solid #6f6f6f;
	color:#6b7b95;
	font-size:15px;
	width:95px;
	position:absolute;
	padding:4px 0;
}

/** HEADER **/

#header {
    margin: 0 auto;
	position:relative;
	width:978px;
	height:130px;
	font-weight:lighter;
} 

.logo{
	margin:10px 0 0 0;
	padding:2px 0 0 2px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background-color:#fafbfc;
	border:1px solid #efefef;
	width:290px;
	height:60px;
}

.contactInfo{
	float:right;
	margin:10px 0 0 0;
	padding:4px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background-color:#fafbfc;
	border:1px solid #efefef;
	width:185px;
	height:41px;
}

#contactInoSubscribe.contactInfo{
	float:right;
	margin:10px 10px 0 0;
	padding:4px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background-color:#fafbfc;
	border:1px solid #efefef;
	width:185px;
	height:41px;
}



/** MENU **/

#navigation{	
	width:978px;
	height:27px;
	margin:20px 0 0;
	background: #ffffff url(../images/navigation.jpg) repeat-x;
}

.rss{
	float:right;
	color:#6b7b95;
	font-size:11px;
	padding:0 8px 0 0;
	position:relative;
	z-index:2;
}

.facebook{
	float:right;
	color:#6b7b95;
	font-size:11px;
	padding:0 8px 0 0;
	position:relative;
	z-index:2;
}

.google{
	float:right;
	color:#6b7b95;
	font-size:11px;
	padding:0 8px 0 0;
	position:relative;
	z-index:2;
}


.feeds{
	float:right;
	padding:4px 0;
	width:399px;
	color:#6f6f6f;
}

/** PAGE CONTENT **/

.latestNews{
	height:30px;
	padding:10px 0 0 10px;
	color:#6b7b95;
	font-size:15px;
	width:500px;
	margin:8px 0 0 10px;
	position:absolute;
	
}

#scroll {
	position:relative;
	height:425px;
	overflow:hidden;
	width:976px;
	padding:0;
}

#main {
	position:relative;
	width:976px;
	padding:0;
}

#tools {
	width:9999em;
	position:absolute;
	height:375px;
}

.tool {
	float:left;
	width:976px;
	height:400px;
	background-repeat:no-repeat;
	background-position:0 -40px;
}

.page {
	float:left;
	width:976px;
	background-repeat:no-repeat;
	background-position:0 -40px;
	border-bottom: 1px solid #E6E6E6;
}

.team{
	background: transparent url(../images/teamGradTop.png) no-repeat;
	width:1000px;
	height:380px;
	margin:5px 0 0;
	padding:10px;
}

#team .details{
	width:885px;
	margin:-22px 0 0;
}


.Promo{
	height:140px;
	margin:70px 20px 0 0;
}



.toolPromo{
	height:140px;
	margin:70px 20px 0 0;
}


.details {
	color:#666;
	float:left;
	font-size:20px;
	margin:0;
	padding:20px 0 0 20px;
	width:505px;
}

.demos {
	float:right;
	padding:0;
	width:450px;
	margin:0;
}

#services .demos {
	float:right;
	padding:0;
	width:450px;
	margin:20px 0 0;
}

#info .demos {
	float:right;
	padding:0;
	width:450px;
	margin:-20px 0 0;
}

#health .demos {
	float:right;
	padding:0;
	width:450px;
	margin:-20px 0 0;
}

#dental .demos {
	float:right;
	padding:0;
	width:450px;
	margin:60px 0 0;
}

#care .demos {
	float:right;
	padding:0;
	width:450px;
	margin:-40px 0 0;
}


.demoImage {
	float:right;
	padding:0;
	width:450px;
	margin:0;
}




/** LISTS */

#navigation ul{
	padding:5px 0 0 15px;
	margin:0;
	width:978px;
}

#navigation li{
	list-style:none;
	padding:0 36px 0 0;
	font-size:1.4em;
	float:left;
	color:#9b9b9b; 
}

/**BOXES */

.box1{
  	width:200px;
  	height:160px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background: #fafbfc url(../images/boxGrad.jpg) repeat-x;
	border:1px solid #efefef;
	float:left;	
	margin:13px 13px;
	padding:0;
}

.box1 img{
	margin:10px 10px 2px;
}

/** PROMOS */

#promoSection{
	clear:both;
	height:160px;
	position:relative;
	width:978px;
	padding:0 0 10px 0;
}

.promos{
	width:218px;
	height:130px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #ddd;
	float:left;
	margin:0 6px 0 0;
	padding:10px;
	background: #fafbfc url(../images/promoGrad.jpg) repeat-x;
	background-color:#fafbfc;
}


#promoFour{
	margin:0;
}

/** ADVERTISING **/

#advertising{
	clear:both;
	height:60px;
	position:relative;
	width:978px;
	margin:0 auto;
}

#advertising .blocks{
	background: #fff url(../images/ads.jpg) no-repeat;
	height:41px;
	position:relative;
	width:453px;
	margin:0 auto;
	
}


/** FOOTER **/

#footer{
	position:relative;
	width:100%;
	height:30px;
	width:978px;
	margin: 0 auto;
	color:#666;
	padding:0;
}


.copyright {
	font-size:11px;
	float:left;
	padding: 0 0 0 10px;
}

.site {
	font-size:11px;
	float:right;
	padding:0;
	width:215px;
}

/** JQUERY **/

/** SCROLL */
#thumbs {
	background:url(../images/scroll/demo-navi.jpg) no-repeat;
	height:90px;
	position:absolute;
	top:375px;
	width:990px;
	left:-8px;
}

.t a {
	background:transparent url(../images/scroll/demo-navi.jpg) no-repeat scroll -528px -90px;
	margin-left:7px;
	display:block;
	width:49px;
	float:left;
	height:99px;
	cursor:pointer;
}



.t a.active {
	cursor:default !important;
}

.navi {
	margin-left:642px;
	_margin-left:642px;
}

/* CSS sprite for the navigation */
#t0 		  { margin-left:529px; _margin-left:517px;}
#t0.active { background-position:-528px 0 !important; }
#t0:hover  { background-position:-528px -180px; }
#t0:active { background-position:-528px -270px; }

#t1			{ background-position:-649px -90px; }
#t1:hover 	{ background-position:-649px -180px; }
#t1:active	{ background-position:-649px -270px; }
#t1.active	{ background-position:-649px 0 !important; }

#t2			{ background-position:-705px -90px; }
#t2:hover 	{ background-position:-705px -180px; }
#t2:active	{ background-position:-705px -270px; }
#t2.active	{ background-position:-705px 0 !important; }

#t3			{ background-position:-761px -90px; }
#t3:hover 	{ background-position:-761px -180px; }
#t3:active	{ background-position:-761px -270px; }
#t3.active	{ background-position:-761px 0 !important; }

#t4			{ background-position:-817px -90px; }
#t4:hover 	{ background-position:-817px -180px; }
#t4:active	{ background-position:-817px -270px; }
#t4.active	{ background-position:-817px 0 !important; }

#t5			{ background-position:-874px -90px; }
#t5:hover 	{ background-position:-874px -180px; }
#t5:active	{ background-position:-874px -270px; }
#t5.active	{ background-position:-874px 0 !important; }

#t6			{ background-position:-930px -90px; }
#t6:hover 	{ background-position:-930px -180px; }
#t6:active	{ background-position:-930px -270px; }
#t6.active	{ background-position:-930px 0 !important; }


/** OVERLAY */

.overlay{
	background: #ffffff url(../images/overlayGrad.jpg) repeat-x ;
	padding:15px;
    display:none;
	width:910px;
	font-family: Helvetica;
}

#subscribe.overlay{
	background: #ffffff url(../images/overlayGrad.jpg) repeat-x ;
	padding:0px 0px 0px 15px;
    display:none;
	width:918px;
	font-family: Helvetica;
}


.contentWrapHome {
	height:280px;
	overflow-y:auto;
	margin:5px;
}

#subscribe.contentWrapHome {
	height:445px;
	margin:0px 0px 5px 5px;
	overflow-x:hidden;
}

.contentWrapSmall {
	height:300px;
	overflow-y:auto;
	margin:5px;
}

.contentWrap {
	height:380px;
	overflow-y:auto;
	margin:5px;
}


.overlay h2 {
	color:#6B7B95;
	font-size:32px;
	font-weight:lighter;
	width:100%;
}

#subscribe.overlay h2 {
	color:#6B7B95;
	font-size:32px;
	padding:25px 0 0;
	font-weight:lighter;
	width:100%;
}

.overlay h3 {
	margin: 0 0 0 -10px;
	margin-bottom:0px;
	padding:5px 10px;
	font-weight:lighter;
	line-height:20px;
	color:#555555;
	font-size:18px;
	width:470px;
}

.overlay h4 {
	margin: 0 0 0 -10px;
	margin-bottom:0px;
	padding:5px 10px;
	font-weight:lighter;
	line-height:16px;
	color:#6b7b95;
	font-size:14px;
	width:470px;
}

.overlay p{
	font-weight:lighter;
	line-height:16px;
	color:#6F6F6F;
	font-size:14px;
	padding:4px 0 10px 0;
	margin:0;
	width:470px;
}

#subscribe.overlay p{
	font-weight:lighter;
	line-height:20px;
	color:#6F6F6F;
	font-size:16px;
	padding:4px 0 5px 0;
	margin:0;
	width:470px;
}


.overlay ul{
	color:#6F6F6F;
	font-size:14px;
	padding:5px 0 15px 20px;
}

.overlay li{
	line-height:17px;
	width:470px;
	list-style: square;
	padding:5px 0 0;

}

.contentImage{
	float:right;
	height:100%;
	margin:0 20px 0 0;
	width:380px;
}

#subscribe.contentImage{
	float:right;
	height:100%;
	margin:0px;
	width:380px;
}


.overlay div.close{
	border:medium none;
	float:right;
	margin:-0.7em -0.4em 0 0;
	padding:2px;
	position:relative;
	background:none;
	cursor: default;
	color:#6b7b95;
	font-size:14px;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

div.overlay div.close, #overlay div.close {
	-moz-background-clip:border;
	-moz-background-inline-policy:continuous;
	-moz-background-origin:padding;
	cursor:pointer;
	height:35px;
	position:absolute;
	right:10px;
	top:20px;
	width:55px;
}

.overlay div a{
	color:#6b7b95;
	text-decoration:none;
}

.overlay div a:hover{
	color:#949393;
}

/** ACCORDION */

#accordion {
clear:both;
padding:5px 0 0 0;
width:505px;
}


#accordion h2 {
	margin:0;
	padding:10px 0 0 0;
	font-size:18px;
	font-weight:lighter;
	cursor:pointer;		
	border:none;
}

#accordion h2.current {
	cursor:default;
}

#accordion div.pane {
	border-width:0 2px;
	display:none;
	height:220px;
	padding:5px;
	color:#fff;
	font-size:12px;
}

#accordion div.pane h3 {
	font-weight:normal;
	margin:0 0 -5px 0;
	font-size:16px;
	color:#999;
}


/***RSS READER***/

.rssFeed
{
	font-size: 90%;
	margin:0 0 0 100px;
}
.rssFeed a
{
	text-decoration:none;
	background:none;
	color:#6f6f6f;
	margin:0;
	padding:0;
	width:390px;
	height:20px;
	
}
.rssFeed a:hover
{
	text-decoration:none;
	background:none;
	color:#6b7b95;
}


.rssBody { border: none; }
.rssBody ul { list-style: none; }
.rssBody ul, .rssRow, .rssRow h4, .rssRow p
{
	margin: 0;
	padding: 0;
}

.rssRow { 

padding: 4px 0 0 10px; 

}
.rssRow h4 { font-size: 1.1em; }
.rssRow div
{
	font-size: 90%;
	color: #666;
	margin: 0.2em 0 0.4em 0;
}

.odd {  }


#facebox {
    /* overlay is hidden before loading */
    display: none;
    /* standard decorations */
    width: 400px;
    border: 10px solid #666;
    /* for modern browsers use semi-transparent color on the border. nice! */
    border: 10px solid rgba(82, 82, 82, 0.698);
    /* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

#facebox div {
    padding: 10px;
    border: 1px solid #6b7b95;
    background-color: #fff;
	font-size:16px;
	color:#6f6f6f
}

#facebox div a{
	color:#6b7b95;
}

#facebox h2 {
    margin: -11px;
    margin-bottom: 0px;
    color: #fff;
    background-color: #6b7b95;
    padding: 5px 10px;
    border: 1px solid #6b7b95;
    font-size: 20px;
}

#facebox h3 {
    margin: 10px 0 0;
    color: #6b7b95;
    font-size: 18px;
}
