/* CSS document for Freelance pages. */

/* ------------------------------------------------------ */
/* Project Name: jQuery Tests and Demos                   */
/*   Description: for animation of div sizes              */
/*   With File: jQueryDemo.html                           */
/*   Web Author: Russ Thompson                            */
/*   E-Mail: russ[at]freelanceitsolutions[dot]com         */
/* ------------------------------------------------------ */
/* File: ..\demos\css\jQueryDemo.css                      */
/*                                                        */
/* --------- version 04.04.2011 -----------               */


div.websiteEffectsDivInactive {
	position: absolute;
	top: 40px;
	left: 724px;
	
	width: 150px; 
	height: 30px;
	
	padding: 3px;
	
	z-index: 10;
	
	overflow: hidden;
}

div.websiteEffectsDivActive {
	position: absolute;
	top: 40px;
	left: 274px;
	
	width: 600px;
	height: 325px;
	
	z-index: 10;
	
	overflow: hidden;
}

div.applicationEffectsDivInactive {
	position: absolute;
	top: 90px;
	left: 724px;
	
	width: 150px;
	height: 30px;
	
	padding: 3px;
	
	z-index: 9;
	
	overflow: hidden;
}

div.applicationEffectsDivActive {
	position: absolute;
	top: 90px;
	left: 174px;
	
	width: 700px;
	height: 555px;
	
	z-index: 9;
	
	overflow: hidden;
}

div.smartPhoneEffectsDivInactive {
	position: absolute;
	top: 140px;
	left: 724px;
	
	width: 150px;
	height: 30px;
	
	padding: 3px;
	
	z-index: 8;
	
	overflow: hidden;
}

div.smartPhoneEffectsDivActive {
	position: absolute;
	top: 140px;
	left: 324px;
	
	width: 550px;
	height: 300px;
	
	z-index: 8;
	
	overflow: hidden;
}

div.socialNetEffectsDivInactive {
	position: absolute;
	top: 190px;
	left: 724px;
	
	width: 150px;
	height: 30px;
	
	padding: 3px;
	
	z-index: 7;
	
	overflow: hidden;
}

div.socialNetEffectsDivActive {
	position: absolute;
	top: 190px;
	left: 324px;
	
	width: 550px;
	height: 300px;
	
	z-index: 7;
	
	overflow: hidden;
}

h3.effectsTitle { 
	margin: 0; 
	padding: 2px;
	
	font-family: arial, sans-serif;
	font-size: 12px;
	text-align: center;
	
	cursor: hand;
	cursor: pointer;
}

div.slideIn {
	position: absolute;
	top: 50px;
	left: 5px;
	
	width: 590px;
	height: 270px;
	
	overflow: hidden;
}

div.slideOutLeft {
	position: absolute;
	top: 50px;
	left: -605px;
	
	width: 590px;
	height: 270px;
	
	overflow: hidden;
}

div.slideOutRight {
	position: absolute;
	top: 50px;
	left: 605px;
	
	width: 590px;
	height: 270px;
	
	overflow: hidden;
}

div.copyDiv {
	position: absolute;
	top: 0px;
	left: 0px;
	
	font-family: arial, sans-serif;
	font-size: 12px;
	text-align: right;
	
	width: 280px;
	max-width: 280px;
	min-width: 280px;
	
	padding: 5px;
}

div.imageDiv {
	position: absolute;
	top: 0px;
	left: 290px;
	
	text-align: center;
	
	width: 300px;
}

div.appStartIn {
	position: absolute;
	top: 50px;
	left: 5px;
	
	width: 690px;
	height: 500px;
	
	overflow: hidden;
}

div.appStartRight {
	position: absolute;
	top: 50px;
	left: 705px;
	
	width: 690px;
	height: 500px;
	
	overflow: hidden;
}

div.appImageDiv {
	position: absolute;
	top: 0px;
	left: 0px;
	
	text-align: center;
	
	width: 690px;
	height: 380px;
	
	overflow: auto;
}

div.appCopyDiv {
	position: absolute;
	top: 390px;
	left: 5px;
	
	font-family: arial, sans-serif;
	font-size: 12px;
	text-align: center;
	
	width: 685px;
	height: 120px;
	
	overflow: auto;
}

div.smartPhoneStartIn {
	position: absolute;
	top: 50px;
	left: 5px;
	
	width: 530px;
	height: 250px;
	
	overflow: hidden;
}

div.smartPhoneStartRight {
	position: absolute;
	top: 50px;
	left: 555px;
	
	width: 530px;
	height: 250px;
	
	overflow: hidden;
}

div.smartPhoneImageDiv {
	position: absolute;
	top: 0px;
	left: 0px;
	
	text-align: center;
	
	width: 528px;
	height: 148px;
	
	overflow: auto;
}

div.smartPhoneCopyDiv {
	position: absolute;
	top: 150px;
	left: 0px;
	
	font-family: arial, sans-serif;
	font-size: 12px;
	text-align: left;
	
	width: 528px;
	height: 148px;
	
	overflow: auto;
}

div.socialNetStartIn {
	position: absolute;
	top: 50px;
	left: 5px;
	
	width: 530px;
	height: 250px;
	
	overflow: hidden;
}

div.socialNetStartRight {
	position: absolute;
	top: 50px;
	left: 555px;
	
	width: 530px;
	height: 250px;
	
	overflow: hidden;
}

div.socialNetImageDiv {
	position: absolute;
	top: 0px;
	left: 0px;
	
	text-align: center;
	
	width: 528px;
	height: 181px;
	
	overflow: auto;
}

div.socialNetCopyDiv {
	position: absolute;
	top: 183px;
	left: 0px;
	
	font-family: arial, sans-serif;
	font-size: 13px;
	text-align: center;
	
	width: 528px;
	height: 108px;
	
	overflow: auto;
}

img.leftButton {
	position: absolute;
	top: 285px;
	left: 10px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.rightButton {
	position: absolute;
	top: 285px;
	left: 575px; /* this will have to be adjusted depending on the width of the image */
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.appLeftButton {
	position: absolute;
	top: 525px;
	left: 10px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.appRightButton {
	position: absolute;
	top: 525px;
	left: 676px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.smartPhoneLeftButton {
	position: absolute;
	top: 275px;
	left: 10px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.smartPhoneRightButton {
	position: absolute;
	top: 275px;
	left: 515px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.socialNetLeftButton {
	position: absolute;
	top: 275px;
	left: 10px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}

img.socialNetRightButton {
	position: absolute;
	top: 275px;
	left: 515px;
	
	cursor: hand;
	cursor: pointer;
	
	z-index: 5;
}