/*This is a CSS document*/
/*  FONT LIST */
@font-face{
	font-family: Segoe;
	src: url(fonts/segoeui.ttf) format('truetype'), url(fonts/segoeui.eot) format('eot'), url(fonts/segoeui.woff) format('woff'); 
}

@font-face{
	font-family: Caviar Dreams;
	src:url(fonts/CaviarDreams.ttf) format('truetype'), url(fonts/CaviarDreams.eot) format('eot'), url(fonts/CaviarDreams.woff) format('woff');	
}

@font-face{
	font-family: Quicksand Light;
	src:url(fonts/Quicksand_Light.eot) format('eot'), url(fonts/Quicksand_Light.woff) format('woff'), url(fonts/Quicksand_Light.ttf) format('truetype');
}

@font-face{
	font-family: Bolina;
	src: url(fonts/Bolina.eot) format('eot'), url(fonts/Bolina.woff) format('woff'), url(fonts/Bolina.ttf) format('truetype');
}
/*  --end of font list--  */

/*  UNIVERSAL CHANGES  */

body{
	min-width: 1200px;
	background-color: #eeeeee;
}

a{
	text-decoration: none;
	color: #000000;	
}


/*  WRAPPERS  */
.siteWrapper{
	max-width: 1200px;
	margin: 0 auto;	
	margin-top: 1em;
	overflow: hidden;
	background-color: #FFFFFF;
	box-shadow: .5em .5em 2em #555555;
	/*border: medium solid black;*/
}

#contentWrapper{
	width: 100%;
}
/*  --end of wrappers--  */


/*  BANNER AREA  */
#titleArea{
	width: 100%;
	padding-bottom: 30em;
	margin-top: -8em;
	background-image: url(images/banner1.png);
	background-repeat: no-repeat;	
}

.banner{
	width: 81%;
	margin: 0 auto;
	margin-bottom: 2.5em;
	background-image: url(images/banner1.png);
	background-repeat: no-repeat;
}

	.banner img{
		width: 100%;
	}

.logo{
	width: 50%;
	float: left;
	margin-top: 11em;
}

	.logo img{
		width: 30em;	
		display: block;
	}

.logoTitle{
	width: 50%;
	margin-top: 2em;
	float: left;	
}

	.logoTitle h1{
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
		font-size: 3em;	
	}
	
	.logoTitle h2{
		font-family: "Quicksand Light";
		font-size: 2em;	
		display: block;
		margin-top: -1.5em;
	}
/*  --end of banner area--  */

/*  TOP BAR AND NAVIGATION */
#topBar{
	width: 100%;
	padding-bottom: 6em;
	margin-top: -1.4em;
	background-color: #dddddd;
	border-bottom: medium solid #888888;
	border-top: medium solid #888888;
}

.nav{
	width: 50%;
	float: right;
	padding: 0;
}

	.nav ul{
		width: 100%;
		height: 2em;
		margin: 0 auto;
		padding-top: 2em;
	}
	
		.nav ul li{
			width:6em;
			margin: 0;
			padding: 0;
			padding-right: 2em;
			display: inline-block;
			list-style-type: none;
			font-family: "Caviar Dreams";
			font-weight: bold;
			font-size: 1.5em;
			text-align: center;
		}
		
			.nav ul li img{
				width: 2em;

			}
		
			.linkText{
				vertical-align: middle;	
			}
	
			.nav ul li a{
				color: #555555;
			}
			
			.nav ul li a:hover{
				color: #ffffff;
			}
/*  --end of top bar and navigation--  */

/*  BODY CONTENT AREA  */
.bodyContent{
	width: 74%;
	margin: 0 auto;
	padding-bottom: 5%;
}

#centerColumn{
	width: 100%;
	padding: 0;
	margin: 0;
	left: 0;	
	float: right;
}

	.article{
		margin-top: 3em;
	}
			
		.article  .headline h2{
			display: block;
			width: 100%;
			text-indent: 1%;
			font-family: "Quicksand Light", monospace;
			font-size: 3em;
			text-align: left;
			padding-left: 1%;
			padding-bottom: 3%;
			color: #147153;
			border-bottom: thin solid gray;
		}

		.article p{
			padding: 4%;
			margin-top: -8%;
		}
		
		.articleTextArea p{
			font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
			font-size: 1.3em;
		}
		
		.articleTextArea img{
			float: right;
			width: 20em;
			margin-top: 6em;
			padding-left: 1em;
			border-radius: 10px;
		}
		
		.firstLetter{
			font-family:Bolina;	
			font-size: 8em;
			color: #eeeeee;
			position:static;
		}
				
		.firstLine{
			display: inline-block;
			margin-bottom: -2.2em;	
		}
				
/*  --end of body content area--  */

/*  TESTIMONIAL SECTION  */
.testimonial{
	width: 90%;
	display: block;
	margin: 0 auto;
}

.testimonial h3{
	font-family: "Caviar Dreams", sans-serif;
	font-size: 1.2em;
	text-align: center;
	padding: .5em;
	padding-top: 1em;
	color: #555555;
	background-color: #eeeeee;
}

.testimonies{
	border: medium solid #eeeeee;
	/*border-bottom-left-radius: .5em;
	border-bottom-right-radius: .5em;*/	
	margin-top: -1.196em;	
	margin-bottom: 2em;
}

.testimony{
	width: 90%;
	display: block;
	margin: 0 auto;
	margin-top: 3em;
}

	.testimony p{
			font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
			font-size: 1.2em;
			font-style: italic;
			text-align: left;	
	}

	.testimony h4{
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
		font-size: 1em;	
		display: block;
		margin-top: -.7em;
	}
	
	.testimony h5{
		font-family: GeosansLight;
		font-size: .9em;
		display: block;
		margin-top: -1.4em;	
		font-style: italic;	
	}
	
	.testimony img{
		float: left;
		padding-right: 2em;
		margin-top: 1.125em;	
	}
.testimonySeperator{
	width: 50%;
	border-top: thin solid #eeeeee;
	margin: 0 auto;
	margin-top: 2em;
	padding-bottom: 2em;	
}
/*  --end of testimonial section--  */

/*  SERVICES AREA  */
#testingListGroup{
	width: 100%;
	margin: 0 auto;	
}

#testingList{
	display: block;
	margin-bottom: 15em;
	margin-top: 0;
	padding: 0;
	border: thin solid white;
}

.servItem{
	width: 33%;
	float: left;	
}

	.servItem p{
		text-align: center;	
	}

#matrixList{
	width: 83%;
	display: block;
	padding-top: 4em;
	margin: 0 auto;
}

.devList{
	margin: 0 auto;
}

	.devList img{
		max-height: 4em;
		max-width: 4em;
		padding-right: 2em;
	}

#os{
	float: left;
	margin-top: -13em;
	margin-left: 4em;
}

#pbrowsers{
	float: left;
	margin-top: -12.5em;
	margin-left: 10em;	
}

#mbrowsers{
	float: left;
	margin-top: -12.2em;
	margin-left: 11em;	
}

#mobileTestingDevices{
	float: left;
	margin-top: -12.2em;
	margin-left: 11em;	
}

	#mobileTestingDevices img{
		max-height: 7em;
		max-width: 6em;	
	}

#title{
	font-family: Caviar Dreams;
	font-size: 1.5em;
	text-align: left;
	margin-top: 2em;
	display: block;
	width: 40%;		
}
/*  --end of services area--  */

/*  PORTFOLIO AREA  */
#sliderTitle{
	font-family: Caviar Dreams;
	font-size: 1.5em;
	text-align: left;
	text-indent: .5em;
	/*border-top: thin solid gray;*/
	display: block;
	width: 50%;	
	margin-top: 5em;
}

#portfolioSliderContainer{
	width:100%;
	overflow: hidden;
	margin: 0 auto;
	margin-bottom: 3em;
	border-top: medium solid #eeeeee;
	padding-top: 1em;
	/*border-left: medium solid #eeeeee;*/
}

div#portfolioSliderContent {
	width: 560%;
	margin: 0 auto;
    position: relative;
    /* Chrome, Safari, Opera */
    -webkit-animation-name: portfolio;
    -webkit-animation-duration: 50s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: portfolio;
    animation-duration: 50s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state: running;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes portfolio {
    0%   {left: 100%;}
    100% {left: -575%;}
}

/* Standard syntax */
@keyframes portfolio {
    0%   {left: 100%;}
    100% {left: -575%;}
}

.portImg{
	max-height: 1em;
	display: inline-table;
	vertical-align: middle;
	padding-right: 4em;
}

	.portImg img{
		max-height: 5em;	
	}
/*  --end of portfolio area--  */

.toTop{
	display: block;
}

	.toTop a{
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
		text-decoration: none;
		color: #888888;	
	}

.space{
	width: 100%;
	padding-bottom: 10%;
	background-color: #FFFFFF;
}

/*  CONTACT AREA  */
#contactArea{
	width: 90%;
	margin: 0 auto;
	padding-bottom: 12%;
}

.contactBlock{
	width: 49.5%;
	padding: 0;
	margin: 0;
	margin-top: 1.5%;
	margin-bottom: 2%;
}

#contactArea #contactBlockOne{
	float: left;
}
	
#contactArea #contactBlockTwo{
	float: right;
}
		
#contactArea #contactBlockThree{
	float: left;
}
		
#contactArea #contactBlockFour{
	float: right;
}

.contactAreaIcon{
	width: 20%;	
	float: left;
}

.contactAreaInfo{
	width: 79%;	
	display: table-cell;
	margin: 0;
	padding: 0;
	margin-top: 5%;
	float: right;	
}

.contactBlock img{
	max-height: 100%;
	max-width: 100%;
	padding: 0;
	margin: 0;
	text-align: center;
	float: left;
}
		
.contactBlock p{
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	text-align: left;
	padding: 0;
	margin: 0;
	padding-top: 1%;
}

	/*  SOCIAL MEDIA  */
	.socialMedia{
		width: 90%;
		display: block;
		margin: 0 auto;
		display: none;
	}
	
	.smIcon{
		width: 22%;
		display: inline-block;
		margin-left: 2%;
		margin-top: .6em;
	}
		
			.smIcon a{
				padding-bottom: 5%;	
			}
		
			.smIcon img{
				width: 3em;
				text-align: center;
			}
	.socialMedia h3{
		font-family: "Caviar Dreams", sans-serif;
		font-size: 1.2em;
		text-align: left;
		padding: .5em;
		padding-top: 1em;
		color: #555555;
	}		
	/*  --end of social media--  */
/*  --end of contact area--  */

/*  FOOTER AREA  */
footer{
	width: 100%;
	background-color: #000000;
	padding-bottom: .5em;
}

	footer p{
		color: #ffffff;
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
		font-size: 1em;
		display: block;
		padding-top: 1em;
		padding-bottom: -2em;
		text-align: center;	
	}
/*  --end of footer area-- */