/*  
Website: http://www.iitytracking.com/
Name: Is It There Yet Portal Site
Description: CSS based website, designed and hosted by Artemis IT Solutions.
Version: 1.0
Author: Marc Giguere
Author URI: http://www.artemisit.com
Comments: This stylesheet is best viewed without word wrapping. Credit to
Jefte Puente for original stylesheet guidelines
*/

/* Colors

Grey - d4d8ca
Blue - 0447d6
Maroon - 114172

*/

/* Body */
body.Main { background: #d4d8ca; font-size: 62.5%; font-family: Verdana, Arial, Helvetica, sans-serif; }
body.NoLayout { background-image: none; background-color: #FFFFFF; }

/* Core Content/Body Styles */
#page { border: 1px solid #0447d6; margin: 15px auto; width: 900px; background: white; }
#content { color: #000; font-size: 1.2em; }

/* Common Sub Page Styles */
.ContentSubPages { margin: 12px 12px 12px 12px; }

/* Header/Footers */
#header { width: 100%; height: 90px; background-color: #000; }
#bottom { clear: both; background-color: #0447d6; width: 900px; height: 30px; }
#footer { padding: 7px 0 5px 0; text-align: center; font-size: 1.1em; color: #fff; font-weight: bolder; }

/* Heading Styles */
h1 { font-size: 1.8em; color: #114172; font-weight: bolder; margin-bottom: 0; }
.h1 { font-size: 1.8em; color: #114172; font-weight: bolder; margin-bottom: 0; }
h2 { font-size: 1.2em; color: #114172; font-weight: bolder; margin-bottom: 0; }
.h2 { font-size: 1.2em; color: #114172; font-weight: bolder; margin-bottom: 0; }
h3 { font-size: 0.9em; color: #114172; font-weight: bolder; margin-bottom: 0; }
.h3 { font-size: 0.9em; color: #114172; font-weight: bolder; margin-bottom: 0; }

/* Other Misc Styles/Headings */
.servicemark { font-size: 0.6em; vertical-align:super; }
.BlueText { color: #0447d6; font-weight: bolder; }
.MaroonText { color: #114172; font-weight: bolder; }
.BlueHeader { color: #0447d6; font-size: 1.5em; font-weight: bolder; }
.reportfooter { padding: 5px 5px 5px 5px; font-size: 0.8em; margin:0; }
hr { display: none; } /* Horizontal Rules are hidden from standard browsers and screen readers, yet are visible in text-only browsers to help seperate content from nav.  */

/* Message Box Styles */
#MessageBox { width: 600px; display: none;  }
.errorBox {clear: left; padding: 5px 5px 5px 30px; font-size: 1.0em; font-weight: bold; border: 1px solid #FF0000; background: #FFE4E4 url('/coreimages/ico_error.png') no-repeat 5px 5px; margin: 0 0 10px 0;}
.messageBox {clear: left; padding: 5px 5px 5px 30px; font-size: 1.0em; font-weight: bold; border: 1px solid #FFCC00; background: #fffdd6 url('/coreimages/ico_yellowerror.png') no-repeat 5px 5px; margin: 0 0 10px 0;}
.positiveBox {clear: left; padding: 5px 5px 5px 30px; font-size: 1.0em; font-weight: bold; border: 1px solid #6EC461; background: #E5FFE0 url('/coreimages/ico_checkmark.png') no-repeat 5px 5px; margin: 0 0 10px 0;}

/* Generic Link Styles */
a:link { color: #0447d6; text-decoration: none; }
a:visited { color: #000;  text-decoration: none; }
a:hover { color: #0447d6; }
a.redlink:link { color: #114172; text-decoration: none; font-weight: bolder; }
a.redlink:visited { color: #114172; text-decoration: none;  font-weight: bolder;}
a.redlink:hover { color: #114172;  font-weight: bolder;}

/* Form Styles */
form { margin: 0; }
label { text-align: left; width: 180px; padding-right: 10px; line-height: 19px; float: left; font-size: 1.1em; font-weight: bolder; color: #0447d6; } 
.small { width: 90px; }
.medium { width: 120px; }
input { border: 1px solid black; float: left; margin-bottom: 10px; font-size: 1.0em; font-weight: bolder; padding: 2px 4px; }
select { font-size: 1.0em; font-weight: bolder; float: left; margin-bottom: 10px; padding: 2px 4px; }
textarea { font-size: 1.0em; font-weight: bolder;  }
.formInput { border: 1px solid black; margin-bottom: 10px; padding: 2px; width: 170px; }
.formCheckBox { border: 0px; }
.formSubmits { border: 0; float: left; }
.formResets { float: left; margin-top: 2px; cursor:pointer; margin-left: 2px; }

/* Button Holders */
.formButtons { float: left; margin-top: 4px; cursor:pointer; margin-right: 2px; margin-left: 2px; }
.formButtonsViewOnly { float: left; margin-top: 4px; margin-right: 2px; margin-left: 2px; }
.formButtonsSmall { float: left; margin-top: 4px; cursor:pointer; margin-right: 2px; margin-left: 2px; }
.formButtonsZip { float: left; margin-top: 1px; cursor:pointer; margin-right: 2px; margin-left: 2px; }
.formButtonsBlank { float: left; 
					cursor:pointer; 
					width: 100px; 
					height: 27px; 
					background-image: url(/images/but-BlankButton.gif); 
					background-repeat:no-repeat; 
					font-family: Verdana, Arial, Helvetica, sans-serif; 
					font-weight: bold; font-size: 0.8em; color: #FFF; 
					padding-left: 43px; padding-top: 6px; }
.formBreak { line-height: 34px; }
.formBreakSm { line-height: 20px; }
.formBreakLg { line-height: 40px; }
.SpacerCell { width: 10px; float: left; }
	
	/* Common Form Elements */
	#City { width: 100px; margin-right: 8px; }
	#State { width: 200px; margin-right: 8px; }
	#ZipCode { width: 50px; margin-right: 4px;}
	#DropZipCode { width: 50px; margin-right: 4px;}
	#ZipPlus { width: 30px; }
	#Phone_1 { width: 30px; margin-right: 4px; }
	#Phone_2 { width: 30px; margin-right: 4px; }
	#Phone_3 { width: 40px; }
	#Phone_4 { width: 30px; margin-right: 4px; }
	#Phone_5 { width: 30px; margin-right: 4px; }
	#Phone_6 { width: 40px; }
	#Fax_1 { width: 30px; margin-right: 4px; }
	#Fax_2 { width: 30px; margin-right: 4px; }
	#Fax_3 { width: 40px; }

/* Go Buttons w/Text */
.GoButtons  { width: 240px; height: 57px; margin-bottom: 10px; }
.GoButtons .Text { width: 145px; float: right; margin-top: 1.6em; text-align: left; }
.GoButtons .Button { width: 57px; float: left; margin-left: 15px;}

/* Home Page Login/Content */
#HomePage { margin: 12px 12px 12px 12px; } 
#WelcomeLoginArea { width: 540px; float: left; }
#WelcomeLoginBox { width: 280px; float: left; margin-top: 6px; }
#WelcomeLoginBox label { width: 70px; float: left; display: inline; margin: 0 10px 0 0; padding: 0; }
#WelcomeLoginButton { width: 60px; float: left; margin-left: 10px; }

/* User Home Page */
#UserHome { margin: 0px; }
#UserHomeLeft { width: 500px; float: left; }
#UserHomeMessage { margin: 12px 0 0 12px; width: 480px; float: left; }
#UserHomeImage { width: 425px; height: 282px; background: url(/images/art-UserHome.jpg); background-position: bottom; background-repeat:no-repeat; border-top: 1px solid #114172; border-right: 1px solid #114172;  float: left;}
#UserHomeRight { width: 370px; float: right; margin: 12px 12px 0 0;  }
#UserHomeOptions { width: 365px; float: right;  }

/* Downloads Page */
#DownloadTop { width: 100%; height: 200px; }
#DownloadBottom { width: 100%; }

/* Contact Us Page */
#ContactUsForm { width: 100%; }
#ContactUsForm label { width: 155px; }
#ContactUsForm .formSubmits { border: 0; float: left; }
#ContactUsForm .LgLabel { width: 275px; }
#ContactUsForm #Comments { width: 300px; }

/* Registration Page */
#RegistrationForm { width: 800px; margin: 0 0 0 20px; float: left; }
#RegistrationForm label { width: 225px; }
#RegistrationForm .LgLabel { width: 270px; }
#RegistrationForm .formSubmits { border: 0; float: left; }

/* FTP Config Page */
#FTPConfigForm label { width: 140px; }

/* Add Job Form */
#AddJobForm label { width: 145px; }
#EmailJobUpdatesDuration { width: 30px; }

	/* View All Jobs Page */
	.HeaderTitles { color: #114172; border-bottom: 1px solid black; font-size: 14px; font-weight: bolder;}
	.JobDisplayTitle { color: #114172; border-bottom: 1px solid black; font-size: 12px; }
	#DateLimit { width: 55px; }
	
	/* Common Jobs Details Pages */
	.StopClock {  font-size: x-small; font-weight: bolder; color: #FFFFFF; background-color: red; }
	.InProgress {  font-size: x-small; font-weight: bolder; color: #FFFFFF; background-color: green;}
	.3DigitArea { background-color: #E3E3E3; }
	.5DigitArea { background-color: #F1E0AC; }
	
	/* View Single Job Page */
	.SingleJobDetails { float: left; width: 850px; margin: 10px auto; color: #000; line-height: 125%; font-family: Arial, Helvetica, sans-serif; padding-right: 5px; }
	.JobDetailBox { float: left; padding-right: 5px; margin: 3px; } 
	.JobDisplayFunction { padding-top: 3px;}
	.JobChartBox { width: 250px; margin: 5px auto; }
	.LeftBox { float: left; width: 400px; }
	.RightBox { float: right; width: 385px; }
	#ChartTimeForm label { float: none; width: 120px; padding-right: 10px; }	
	#ChartTimeForm select { font-size: 1.0em; font-weight: bolder; float: none; margin-bottom: 0px; padding: 0px; }
	
	/* View Single Job Detailed Tracking Pages */
	.SingleJobTracking { float: left; width: 750px; margin: 10px auto; color: #000; line-height: 125%; padding-right: 5px; }
	
	.HeaderBox { color: #114172; height: 28px; border-bottom: 1px solid #000000; }
	.HeaderBoxTitle { float: left; padding-bottom: 2px; color: #114172; font-size: 14px; font-weight: bolder;}
	.TitleBox {  float: left; width: 510px; padding-top: 8px; }
	.ButtonBox {  float: right; width: 235px; padding-bottom: 4px; }
	
	/* Zip Level Detail Info Boxes */
	.TitleBoxDone {  float: left; width: 510px; margin-top: 8px; background-color: red; color: white; }
	.TitleBoxRemaining {  float: left; width: 510px; margin-top: 8px; background-color: green; color: white; }
	.JobDisplayZipData { height: 22px; }
	.BackNextButtons { float: right; height: 27px; }
	
	/* State Detail Info Boxes */
	.StateDetailBox { float: left; padding-right: 5px; margin: 3px; display: none; } 
	.StateDataBox { float: left; width: 465px; }
	.StateChartBox { float: right; width: 375px; }
	.StateChartBoxSmall { float: right; width: 230px; }
	
	.ZipDetailBox { float: left; padding-right: 5px; margin: 2px; display: block; width:665px; } 
	.ZipDataBox { float: left; width: inherit; }
	.ZipDisplayTitle { color: #ED1C24; border-bottom: 1px solid black; font-size: 1.0em; vertical-align: text-bottom; padding-right: 3px; float: left; }
	.ZipDisplayData { font-size: 1.0em; padding: 3px 3px 3px 0px; float: left; }
	.ZipDisplayDataDone { color: #FFFFFF; background-color: red; font-size: 1.0em; padding: 3px 3px 3px 2px; float: left; }
	.ZipDisplayDataRemaining {color: #FFFFFF; background-color: green; font-size: 1.0em; padding: 3px 3px 3px 2px; float: left; }

/* Report Styles */
.NewPage { page-break-after: always; line-height: 0; height: 0px; }

/* Listing Items */
.ListingItems { line-height: 155%; margin: 0; padding-left: 1.3em; }

/* Navigation - Uses an unordered list and styles them as buttons */
#navbox { width: 900px; height: 30px; background-color: #0447d6; margin: 0px; padding: 0px;}
#navcontainer {	width: 690px; height: 30px; float: left; }
#navcontainer ul { color: #FFFFFF; padding: 0;  }
#navcontainer ul li { display: inline; padding-top: 5px; padding-bottom: 5px; }
#navcontainer ul { margin: 0; padding: 6px 0 5px 0; font-size: 1.1em; letter-spacing: 0px; }
#mainNavlist li a:hover, #navlist li a:active { color: #60785a; background: #4792b2; text-decoration: none; text-align: left; font-size: 1.1em; }
#navcontainer ul li a { padding: 2px 12px; background-color: #0447d6; color: #fff; border-right: 1px solid #fff; text-decoration: none; float: left; font-size: 1.1em; }
#navcontainer ul li a.lastitem { border: none; }
#navcontainer ul li a:hover { background-color: #4792b2; color: #fff; }
#navphone { width: 200px; height: 20px; text-align: center; padding: 6px 0 5px 0; font-weight: bolder; font-size: 1.6em; color: #fff; float: left; }

/* Images & Alignments

	Using 'class="alignright"' on an image will align the image to the right. 
	And using 'class="centered', will of course center the image. This is much
	better than using align="center", being much more futureproof (and valid)              */

img.home { display: inline; border: none;  }	
img.centered { display: block; margin-left: auto; margin-right: auto; border: none;}
img.alignright { display: inline; border: none; margin-left: 10px; margin-bottom: 10px; }
img.alignleft { display: inline; border: none; margin-right: 10px; margin-bottom: 10px; }
.alignright { float: right; }
.alignleft { float: left; }
.home { float: left; }
.center { text-align: center; margin: 0; padding: 0;}
/* Hacks - May become outdated when/if IE ships with proper CSS support */
div.spacer { clear: both; } /* The infamous "clear div" or "spacer div" hack. An empty div placed below floated divs that clears the floats, so that content can continue to flow below the clear. http://www.complexspiral.com/publications/containing-floats/ */
.hasnodot { list-style-type: none; }
.invisible { display: none; }