﻿
/* typography.css */
h1 {
	font-family: Arial, sans-serif;
	font-size: 20pt;
	font-weight: normal;
	text-align: left;
	line-height: 32px;
	color: #333;
}
h2 {
	font-size: 16pt;
	font-weight: normal;
	text-align: left;
	line-height: 18px;
	color: #333;
}
.container {
	width: 100%;
	min-width: 900px;
	max-width: 1130px;
	margin-top: 20px;
	position: relative;
	background:url(../img/product/product-block-bg.png) repeat-x top;
	border: 1px solid #f1f2f3;
	border-radius: 6px;
	-moz-border-radius: 6px;
}
.container a {
	color: #69F;
	font-size: 11pt;
}
.container a:hover {
	color: #69F;
	text-decoration: none;
}
.product-title-block {
	width: 100%;
	line-height: 18px;
}
.product-title-block .leftBlock {
	width: 40%;
	float: left;
	padding-top: 20px;
}
.product-title-block .rightBlock {
	width: 60%;
	float: right;
}
.product-title-block p {
	color: #666;
	font-size: 12pt;
}
.product-title-block a.plan-pricing-btn {
	background:url(../img/product/plans-pricing-btn.png) left top no-repeat;
	width: 220px;
	height: 40px;
	display: block;
	margin-top: 20px;
}

.product-title-block .screens {
	background:url(../img/product/screens.png) top left no-repeat;
	width: 590px;
	height: 345px;
	display: block;
	position: relative;
	right: 0px;
	top: 17px;
	float: right;
}

.major-features {
	width: 100%;
	position: relative;
	top: -40px;
	left: 34px;
}
.major-features div {
	padding: 0px;
}
.major-features h1 {
	font-family: Arial, sans-serif;
	font-size: 18pt;
	font-weight: normal;
	text-align: left;
	line-height: 12px;
	color: #333;
	padding: 0px 15px 0px 0px;
	display: inline;
}
.feature-block {
	width: 100%;
	padding: 0px 0px 20px 0px;
	margin: 0;
}
.feature-block .leftBlock {
	width: 600px;
	float: left;
	/*background: #f1f2f3;*/
}
.feature-block .rightBlock {
	width: 380px;
	float: right;
	/*background: #f3f4f5;*/
}

.feature-block .leftBlockSecond {
	width: 380px;
	float: left;
	/*background: #f1f2f3;*/
}
.feature-block .rightBlockSecond {
	width: 600px;
	float: right;
	/*background: #f3f4f5;*/
}

.feature-block p {
	font-size: 14px;
	color: #666;
	padding: 0px 10px;
	line-height: 18px;
	margin: 1em 0px;
}
.feature-block .screen-bg {
	background:url(../img/product/screen-bg.png) top left no-repeat;
	width: 462px;
	height: 285px;
	display: block;
}
.feature-block h3.icon-title {
	font-family: Arial, sans-serif;
	padding: 10px 0 10px 65px;
	font-size: 14pt;
	font-weight: normal;
	text-align: left;
	line-height: 32px;
	color: #333;
}

.kanban-icon {
	background:url(../img/product/kanban-icon.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.customize-icon {
	background:url(../img/product/customize-icon.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.task-board {
	background:url(../img/product/task-icon.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.time-sheet {
	background:url(../img/product/time-sheet.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}

.integration {
	background:url(../img/product/integration.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.track-progress {
	background:url(../img/product/track-progress.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.plan-releases {
	background:url(../img/product/plan-releases.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.plan-iterations {
	background:url(../img/product/plan-iterations.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}
.track-bugs {
	background:url(../img/product/track-bugs.png) left no-repeat;
	width: auto;
	dispay: block;
	line-height: 32px;
}




.kanban-screen {background:url(../img/product/kanban-screen.jpg) top left no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 20px 0px;
	
	}
	
.plan-release-screen {background:url(../img/product/plan-release-screen.jpg) top left no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 20px 0px;
	
	}

.track-progress-screen {background:url(../img/product/track-progress-screen.jpg) top right no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 50px 0px;
	
	}

.task-board-screen {background:url(../img/product/task-board-screen.jpg) top left no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 20px 0px;
	
	}
	
.track-bugs-screen {background:url(../img/product/track-bugs-screen.jpg) top left no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 20px 0px;
	
	}

.customize-screen {background:url(../img/product/customize-screen.jpg) top center no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: center;
	background-position: 100px 0px;
	
	}

.time-sheet-screen {background:url(../img/product/time-sheet-screen.jpg) top right no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 30px 0px;
	
	}

.plan-iterations-screen {background:url(../img/product/plan-iterations-screen.jpg) top right no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: right;
	background-position: 30px 0px;
	
	}
	
.integration-screen {background:url(../img/product/integration-screen.jpg) top right no-repeat;
	width: 100%;
	height: 380px;
	display: block;
	text-align: left;
	background-position: 60px -40px;
	
	}

.clear-both {
	clear: both
}