/***********************************************************************************************
* General
***********************************************************************************************/

body, html
{
    font: 14px "Trebuchet MS", Tahoma, Geneva, Arial, Helvetica, sans-serif;
    margin:0;
    padding:0;
    background-color: #ffffff;
    color:#333;
    min-width: 950px;
}

a
{
	color: #cc6600;
	text-decoration: underline;
}

ul
{
	margin-top: 0.1em;
}

h1, h2, h3, h4
{
	color: #556374;
}

/***********************************************************************************************
* Containers
***********************************************************************************************/

#headerLong
{
	background-color: #ffffff;
	min-height:150px;
	height:auto !important;
	height:150px;
}

#header
{
	padding-left: 50px;
	padding-top: 45px;
	margin: 0px auto;
}

#header a:hover
{
	background-color: transparent;
}

#logo
{
	float: left;
}

#logo a
{
	text-decoration: none;
	background-color: transparent;
	outline: none;
}

#topMenuContent
{
	font-weight: bold;
	font-size: 1.2em;
	padding-top: 35px;
	float:left;
	margin-left: 30px;
}

#topMenuContent a 
{
	text-decoration: none;
	margin-right: 30px;
	background-color: transparent;
	outline: none;
	color: #9498a4;
}

#topMenuContent a:hover
{
	color: #556374;
}

#userMenuContent
{
	font-weight: bold;
	font-size: 1.1em;
	color: #e0e0e0;
	margin: 0px auto;
	padding-left:50px;
}

#userMenuContent a
{
	color: #e0e0e0;
	text-decoration: none;
	margin-right: 15px;
	background-color: transparent;
	outline: none;
}

#userMenuContent a:hover
{
	color: #ffffff;
}

.headerSeparator
{
	background: #ffffff url(http://www.uclassify.com/Graphic/gradient.jpg) repeat-x;
}

#wrap
{
	margin: 0px auto;
	margin-top:0px;
	min-height:600px;
	height:auto !important;
	height:600px;
}

#main
{
	position: relative;
    margin: 0px auto;
    width: 95%;
   	padding: 50px 20px 20px 50px;
	min-height:600px;
	height:auto !important;
	height:600px;
}

#footer
{
    margin: 0px auto;
    width: 95%;
	color: #556374;
	font-size: 1em;
	margin-top: 20px;
	padding-bottom: 50px;
	text-align:center;
}

#footer a
{
	color: #556374;
	text-decoration: none;
}

#footer a:hover
{
	color: #334354;
}

.frontLeftCol
{
	width: 45%;
	float: left;
	margin-right: 30px;
}

.frontRightCol
{
	width: 45%;
	float: left;
	margin-left: 30px;
}

/***********************************************************************************************
* Register Ids
***********************************************************************************************/
#registerContainer
{
	background-color: #FFF;
	width: 100%;
}

#registerContainer .registerColumnNarrow
{
	width: 25%;
	float:left;
	padding-right: 5%;
}

#registerContainer .registerColumnWide
{
	width: 39.5%;
	float:left;
}

#registerContainer .stepHead
{
	height: 280px;
	float: left;
}

#registerContainer .topStepNumber
{
	margin-top: 30px;
	text-align: center;
	font-size: 4em;
	color: #556374;
}

#registerContainer .topStepText
{
	text-align: center;
	font-size: 2em;
	color: #556374;
}

#goLogin
{
	margin-top: 20px;
}

#feedback
{
	padding-top: 40px;
}


/***********************************************************************************************
* Input Classes
***********************************************************************************************/

#inputField
{
}

.inputContainer
{
	position: relative;
	margin-top: 50px;
	width: 100%;
}

.inputExpl
{
	position: relative;
	text-align: left;
}

.inputBox, .inputBoxLarge, .apiKeyBox, .xmlTextBox, .inputBoxMedium, .messageBox, .inputBoxFloat
{
	height: 40px;
	color: #666666;
	background: #f3f3f3;
	border-bottom: 	1px solid #999999;
	border-right: 1px solid #999999;
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	margin-bottom: 15px;
}

.inputBox, .inputBoxFloat
{
	width: 200px;
	font-size: 30px;
}

.inputBoxFloat
{
	float: left;
}

.inputBoxMedium
{
	width: 50%;
	font-size: 30px;
	float: left;
}

.inputBoxLarge
{
	width: 100%;
	font-size: 30px;
}

.apiKeyBox
{
	width: 70%;
	float: none;
	font-size: 30px;
}

.xmlTextBox, .messageBox
{
	height: auto;
	width: 99%;
}

.messageBox
{
	font-size: 1.2em;
}


/***********************************************************************************************
* Buttons
***********************************************************************************************/

.confirmButton, .confirmButtonLarge, .classifyButton, .contactbutton, .contactButton
{
	position:relative;
	height:50px;
	font-size: 30px;
	color: #556374;
}

.classifyButton, .contactButton
{
	margin-top: 10px;
	margin-bottom: 10px;
	width: 250px;
}

.confirmButton
{
	margin-top: -3px;
	margin-left: 20px;
	width: 250px;
}

.confirmButtonLarge
{
	margin-top: 30px;
	width: 400px;
}

#confirm { text-align:right; }

/***********************************************************************************************
* Styling
***********************************************************************************************/

/* Round corners */
.content {margin-left:7px;}


/* ################ */

.Cleaner		{margin-top:15px;}
.ApiKeyContainer {margin-top:20px;}
.classifierContainer h1 { padding-bottom: 0px; line-height: 5px; }
.RepeatContainer{ margin-top:20px;}
.ActionPanel	{ margin-top:20px;}
.ResultText		{ margin-top:15px;}

.warnings, .warnginsAbs, .required {color:#FF0000;}
.warnings		{position:absolute;}
.warningsAbs	{position:absolute;}
.cleanup		{margin-top:15px; clear:both;}
.clearBoth		{clear:both;}
.errorMessage	{color:#cc6600; margin-top: 20px;}
.successMessage	{color:#556374; margin-top: 20px;}
.creditExample	{font-style:italic;}

.author			{font-style: italic;}

.imageLeft		{ clear:left; float:left; margin-bottom: 20px; margin-right: 20px;}
.textRight h3	{ margin-top: 0px; }

#progressImg
{
    margin-left:25px;
    margin-top:40px;
}

#feedbackSent
{
    margin-top:40px;
    font-style:italic;
}

hr
{
	color: #cc6600;
	background-color: #cc6600;
	height: 5px;
	margin-top: 20px;
}

h2
{
	margin-bottom: 0.2em;
}

h3
{
	margin-bottom: 0.1em;
}

h4
{
	margin-bottom: 0.1em;
}

.appRow
{
	clear: both;
}

#clsnav
{
	text-align: left;
	margin-bottom: 30px;
	height: 18px;
}

.tab
{
	float: left;
	padding-right: 5px;
	margin-right: 10px;
}

.tab a
{
	color: #556374;
	text-decoration: none;
}

.classContainer, .statsContainer
{
	color: #556374;
	padding: 5px 5px 5px 5px;
	margin-right: 5px;
	margin-bottom: 15px;
	border: solid 3px #fcd17a;
	background-color: #fcd17a;
	font-size: smaller;
}

.statsContainer
{
	color: #cc6600;
	padding-left: 7px;
	margin-top: 30px;
	margin-bottom: 10px;
	width: 170px;
}

.statsContainer h3, .classifierInfo h3
{
	margin-top: 0px;
}

.classifierInfo
{
	padding: 5px 5px 5px 5px;
	margin-right: 5px;
	margin-bottom: 15px;
	border: solid 1px #ddd;
}

.classifierInfoName
{
	width: 80%;
	float: left;
}

.classifierInfoStats
{
	width: 19%;
	float:right;
	text-align: center;
	font-size: 0.8em;
}

.classesHeader
{
	margin-bottom: 10px;
}

.classHeaderLine
{
	font-size: 20px;
}

.className
{
	width: 55%;
	float: left;
}

.classLink
{
	margin-left: 15px;
}

.textBoxWrapper
{
	width: 740px;
}

.clearText
{
	float:right;
	text-decoration: none;
}

.leftText
{
	float: left;
}

.table
{
	padding-top: 20px;
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.tableRow, .tableTopRow
{
	clear: both;
	width: 100%;
}

.tableLeftColNarrow { min-width: 15%; }
.tableColNarrow { min-width: 10%; }
.tableLeftColWide {	min-width: 25%; }
.tableColWide {	min-width: 20%; }

.tableColNarrow, .tableLeftColNarrow, .tableColWide, .tableLeftColWide
{
	float: left;
	border: 1px solid #fff;
}

.tableTopRow .tableColNarrow, .tableTopRow .tableColWide, .tableLeftColNarrow, .tableLeftColWide
{
	background-color: #eee;
	font-weight:bold;
}

.selectedTab
{
	font-weight: bold;
}