/* 	Stylesheet for Vada Computing
	http://vada.net.au

Created by INVOLVED. - involved.com.au (02 December 2010)
email@involved.com.au 


ToC
1.  Defaults
2.  Structure
3.  Header
4.  Content
5.  Side Column (left)
6.  Side Menu (right)
7.  Contact Form
8.  Footer
9.  Fonts
10. Links

*/


/* @group Defaults 
-----------------------------------------*/

html { overflow-y: scroll; }

body {
	margin: 0px;
	padding: 0px;
	background: #fff;
}

html, body { height: 100%; }

.clear { display: none; }

/* CLEAR FIX*/
.clearfix:after {content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.hidden {
	display: none;	
}

/* @end */



/* @group Structure 
-----------------------------------------*/
	
body > #main.wrapper {
	height: auto; 
	min-height: 100%;
}

.wrapper {
	width: 100%;
	height: 100%;
	display: block;
}

	.inner_wrapper {
		width: 940px;
		margin: 0px auto;
		display: block;
		padding: 0px 20px 0px 20px;
	}
		
		#main .inner_wrapper { padding-bottom: 290px; /* must be same height as the footer */ } 
		
		#content { 
			width: 450px;
			display: inline-block;
			float: left;
			margin: 0px 30px 0px 30px;
			
		}
		
		#side_menu {
			width: 210px;
			height: 100%;
			float: right;
			display: block;
			margin-left: 10px;
			position: relative;
			
		}

/* @end */



/* @group Header 
-----------------------------------------*/	

#header {
	width: 100%;
	float: left;
	display: block;
	padding-top: 115px;
	margin-bottom: 40px;
	position: relative;
	background: url(../images/bg_header-logo.gif) no-repeat 0 -80px;
}
	
	#header a.logo {
		width: 200px;
		height: 90px;
		display: block;
		position: absolute;
		top: 40px;
		left: -10px;
		text-indent: -3000px;
	}

	#header ul#nav {
		width: 710px;
		padding: 10px 0px;
		float: left;
		display: inline-block;
		padding-left: 230px;	
		list-style: none;
	}
		#header #nav li {
			float: left;
			display: inline-block;
		}
			#header #nav li.about  		 { width: 210px;}
			#header #nav li.products 	 { width: 190px; }
			#header #nav li.case_studies { width: 220px; }
			#header #nav li.contact 	 { width: 90px; }
			
				#header #nav li a {
					display: inline-block;
					float: left;
					
				}
/* @end */



/* @group Content 
-----------------------------------------*/	

#content { }
	#content .intro {
		min-height: 100px;
		height:auto !important;
		height: 100px;
	}
	
	#content .hidden_for_print { display: none; }
	#content h2 {
		float: left;
		display: block;
		width: 450px;
		margin-bottom: 10px;
	}

	#content h3 { 
		border-bottom: #99d4ed 1px dashed; 
		margin-bottom: 10px;
		padding: 10px 0px 5px 0px;		
	}
	
	#content h3 { float: left; display: block; width:450px; }
	#content h3 span { float: left; display: block; clear: left; width: 100%; padding-top: 3px; }
	
	#content span.divider { 
		float: left; 
		display: block;
		height: 40px;
		width: 100%;
	}
	
	/* Tabs */
	#content #tabs {
		float: left;
		display: block;
	}
	
	#content #tabs ul.nav {
		width: 450px;
		float: left;
		display: block;
		list-style: none;
		padding: 10px 0px;
		margin: 10px 0px 30px 0px;
		border-top: #9ad4ed 1px solid;
		border-bottom: #9ad4ed 1px solid;
	}	
	
		#content #tabs ul.nav li {
			float: left;
			display: block;
			padding: 0px;
		}
		
			#content #tabs ul.nav li a {
				display: inline-block;
				float: left;
				padding: 0px 15px;
				margin: 0px 10px;
			}
			
				#content #tabs ul.nav li a.selected {
					background: #d9eff8;
					-webkit-border-radius: 5px;	-moz-border-radius: 5px; border-radius: 5px;
				}
				
	/* Lists */		
	#content ul,
	#content ol {
		list-style-type: disc;
		float: left;
		display: block;
		clear: both;
		list-style-position: outside;
		margin: 0px 0px 15px 0px;
		padding-left: 25px;
		width: 425px;
	}
		#content ul ul,
		#content ol ol { width: 90%; }
	
	#content ol { list-style: decimal; }
	#content li { display: list-item; padding-bottom: 10px; }
	#content pre { 
		font-family: monospace; 
		white-space: pre; 
		float: left; 
		display: block; 
		clear: both; 
		padding: 10px;
	}				
			
	#content ul.custom_bullets { 
		margin-top: 10px;
		list-style-image: url(../images/bullet.gif);
	}
		#content ul.custom_bullets li { padding-bottom: 10px; }
			



/* @end */



/* @group Side Column (left) 
-----------------------------------------*/	

#side_col { 
	width: 180px;
	display: inline-block;
	float: left;
	margin-right: 20px;
}
			
	#side_col blockquote {
		margin-top: 140px;	
		padding-bottom: 270px;
	}
		#side_col blockquote.image1 { background: url(../images/sidecol/vada_sidecol01.jpg) no-repeat 0 bottom; margin-top: 105px; }
		#side_col blockquote.image2 { background: url(../images/sidecol/vada_sidecol02.jpg) no-repeat 0 bottom; margin-top: 105px; }
		#side_col blockquote.image3 { background: url(../images/sidecol/vada_sidecol03.jpg) no-repeat 0 bottom; margin-top: 105px; }
		#side_col blockquote.image4 { background: url(../images/sidecol/vada_sidecol04.jpg) no-repeat 0 bottom; margin-top: 105px; }

/* @end */


/* @group Side Menu
-----------------------------------------*/	

.feautre_image {
	float: left;
	display: block;
	margin-bottom: 15px;
}

#side_menu dl {
	float: left;
	display: block;	
	margin-bottom: 20px;
}
	#side_menu dl dt { border-bottom: #c2c2c2 1px solid; }

/* Products Menu */
.products #side_menu { margin-top: 83px; }

dl#products_menu {
	position: absolute;	
}
	dl#products_menu dd {
		display: block;
		float: left;
		border-bottom: #c2c2c2 1px solid;
	}
		dl#products_menu dd a {	
			width: 210px;
			height: 55px;
			display: block;
			float: left;
			text-indent: -3000px;
			background: url(../images/sidemenu_products-menu.png) no-repeat 0 0;
		}
			dl#products_menu dd a:hover  { background-color: #eaeaea; }
			dl#products_menu dd.active a { background-color: #d9eff8; }
		
			dl#products_menu dd.haccpac a { background-position: 0px 0px !important; }
			dl#products_menu dd.mealpac a { background-position: 0px -55px !important; }
			dl#products_menu dd.haccpac_mob a { background-position: 0px -110px !important; }
			dl#products_menu dd.laptop_sync a { background-position: 0px -165px !important; }
			dl#products_menu dd.elec_roster a { background-position: 0px -220px !important; }
			dl#products_menu dd.care_plan a   { background-position: 0px -275px !important; }
			
/* Products Overview */

dl#products_overview { margin-top: 35px; }

dl#products_overview dt { margin-bottom: 12px; }
dl#products_overview dd {
	display: block;
	float: left;
}		
	dl#products_overview dd.haccpac { border: none; padding-bottom: 15px; }
	dl#products_overview dd a {
		width: 210px;
		height: 25px;
		display: block;
		float: left;
		text-indent: -3000px;
		background: url(../images/sidemenu_products-overview.png) no-repeat 0 0;
	}	
	
		dl#products_overview dd.haccpac a 		{ background-position: 0px 0px !important; height: 35px; margin-bottom: 5px; }
		dl#products_overview dd.mealpac a		{ background-position: 0px -40px !important; }
		dl#products_overview dd.haccpac_mob a 	{ background-position: 0px -80px !important; }
		dl#products_overview dd.laptop_sync a 	{ background-position: 0px -120px !important; }
		dl#products_overview dd.elec_roster a 	{ background-position: 0px -160px !important; }
		dl#products_overview dd.care_plan a 	{ background-position: 0px -200px !important; }
	
		dl#products_overview dd.haccpac a:hover 	{ background-position: -210px 0px !important; }
		dl#products_overview dd.mealpac a:hover 	{ background-position: -210px -40px !important; }
		dl#products_overview dd.haccpac_mob a:hover { background-position: -210px -80px !important; }
		dl#products_overview dd.laptop_sync a:hover { background-position: -210px -120px !important; }
		dl#products_overview dd.elec_roster a:hover { background-position: -210px -160px !important; }
		dl#products_overview dd.care_plan a:hover   { background-position: -210px -200px !important; }
		

/* Tweets */
#tweets {
	width: 190px;
	min-height: 60px;
	height:auto !important;
	height: 60px;
	float: left;
	display: block;
	background: #e9e9e9 url(../images/bg_twitter-box.gif) no-repeat 0 bottom;	
	-webkit-border-radius: 5px;	-moz-border-radius: 5px; border-radius: 5px;
	padding: 10px 10px 30px 10px;
	margin-top: 30px;
	position: relative;
}
	#tweets #twitter_icon {
		position: absolute;
		top: -25px;
		right: 0px;
	}


/* @end */



/* @group Contact Form 
-----------------------------------------*/	

form {
	width: 450px;
	float: left;
	display: block;
}

	form label { 
		float: left;
		display: block;
		clear: both;
	}

	form .input {
		width: 430px;
		float: left;
		display: block;
		clear: both;
		border: 1px solid #9AD4ED;
		margin-bottom: 20px;
		padding: 6px 10px;
	}

	form textarea { height: 120px; }

	form .form_button {
		float: left;
		display: block;
	}

	form .input.inactive { border: #c1c1c1 1px solid; }
	
	form .ajax_error {
		border: red 1px solid !important;
		color: red !important;
	}

/* @end */



/* @group Footer 
-----------------------------------------*/	

#footer {
	position: relative;
	margin-top: -290px; /* negative value of footer height */
	height: 290px;
	clear:both;
	padding-top: 70px;
} 
	#footer .inner_wrapper {
		width: 710px;
		padding: 0px 20px 0px 250px;	
	}
		#footer ul {
			list-style: none;
			float: left;
			display: block;	
		}	
			#footer ul li {  
				display: inline-block;
				float: left;
			}	

	/* Partners */
	#partners {
		min-height: 90px;
		height:auto !important;
		height: 90px;
		background: #dfdfdf;	
		position: relative;
		padding-top: 10px;
	}	
		#partners .inner_wrapper { 
			overflow: hidden;
			position: relative;
		}
		
			#partners p { 
				position: absolute;
				top: 30px;
				left: 70px;
			}
			#partners ul { width: 5000px; }
				#partners ul li { margin-right: 60px; }	
	
	/* Site Links */
	#site_links {
		min-height: 150px;
		height:auto !important;
		height: 150px;
		padding-top: 40px;
		background: #0093d1;	
	}
		#site_links ul {
			min-height: 100px;
  			height:auto !important;
  			height: 100px;
		}
			#site_links ul li {  
				clear: both;
				padding-right: 95px;
			}
			
			#site_links ul.no_padding li { padding-right: 0px; }
			
	#site_links .copyright {
		float: left;
		display: block;
		clear: both;
		width: 100%;
	}		

/* @end */



/* @group Fonts 
-----------------------------------------*/	

body { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: 12px; color: #666; line-height: 18px; }

h1 	{ font-size: 25px; color: #0193d1; line-height: 30px; padding-bottom: 10px;}
h2 	{ font-family: AllerLightItalic; font-size: 19px; color: #0093d1; line-height: 25px; font-weight: normal; }
h3  { font-size: 16px; color: #0093d1; font-weight: bold; line-height: 20px; }
p 	{ font-size: 15px; line-height: 22px; padding-bottom: 10px; } 


/* Content */

#content p 	{ padding-bottom: 15px; float: left; display: block; clear: left; width: 100%; }
#content .intro p { font-family: AllerLightRegular; font-size: 18px; color: #999; line-height: 22px; padding-top: 10px; font-weight: normal; width: 100%; }
#content p span { font-size: 16px; color: #0093d1; font-family: AllerRegular;  }

#content strong { color: #333; }

#content h1 { color: #0193d1; }
#content h2 { padding-bottom: 10px; }
#content h4,
#content h3 span { font-family: AllerLightItalic; font-size: 14px; color: #666; line-height: 20px; font-weight: normal; }
#content h4 { padding: 4px 0px 10px 0px; }

#content #tabs li strong { font-size: 14px; }


#content ul,
#content ol { font-size: 13px; }

/* Home */
#content h2.intro { padding-bottom: 0px; margin: 0px; }

/* Demo */
#content #demo h3 { margin-bottom: 20px; }

/* Side Col (left) */
#side_col blockquote { font-family: AllerLightItalic; font-size: 20px; color: #999; line-height: 23px; font-weight: normal; }

/* Side Menu */
#side_menu dl dt,
#side_menu h4 {	font-family: AllerRegular; font-size: 12px; color: #333; font-weight: normal; line-height: 27px; text-transform: uppercase; }
#side_menu dd { line-height: 15px; }

/* Tweets*/
#tweets p { font-size: 12px; color: #606060; }


/* Contact Form */
form .input { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: 14px; color: #0093d1; line-height: 16px; }
form .input.inactive { color: #999; }  

/* Footer */
#partners p { font-family: AllerLightItalic; color: #616161; font-size: 11px; }

#site_links,
#site_links p { font-size: 11px; color: #78BDE2; font-weight: bold; line-height: 18px; }


/* @end */


/* @group Links 
-----------------------------------------*/	

a { color: #0093D1; }
a:hover { color: #54A7D9; }

/* Header */
#header #nav li a { font-family: AllerLightRegular; font-size: 22px; color: #999; text-decoration: none; line-height: 30px; }
#header #nav li a:hover { color: #666; }
#header #nav li.active a { font-family: AllerRegular; color: #666; }

/* Tabs */
#content #tabs ul.nav li a { font-size: 12px; color: #666; line-height: 25px; text-decoration: none; }
#content #tabs ul.nav li a.selected { color: #0093d1;  }


/* Footer */
#site_links a { color: #BADFF0; text-decoration: none; }
#site_links a:hover { color: #78BDE2; }


/* @end */

