/* Screen layout: */


body{
margin:0;
padding:30px 0;
font:76% tahoma,verdana,sans-serif;
background:#047 url(img/bodybg.png) repeat-x fixed;
color:#222;
}

/* clear white body used for iframes 
we don't want the sides and boarder info coming into the
frame */
body.iframeinsert{
background: transparent none;
height: 400px;
}

#thetop{
margin:0;
}

#container{
width:720px;
margin:0 auto;
padding:20px 20px 0 20px;
background:#fff url(img/contbg_nosidebar.png) no-repeat;
color:#222;
}

a{
text-decoration:none;
background-color:inherit;
color:#26c;
}

a img{
border:0;
}

p{
margin:0 0 15px 0;
line-height:1.5em;
}

#widemain p,#main p,#sidebar p{
padding:0 0 0 10px;
}

#logo{
float:left;
width:210px;
height:120px;
margin:0 40px 0 0;
padding:0 0 25px 0;
background:#fff url(img/NIC_tech-capT-copy.gif) center no-repeat;
border:4px none #dde;
text-align:center;
color:#555;
overflow:auto;
}

#logo h1{
margin:10px 5px 1px 5px;
letter-spacing:-3px;
}

#logo a{
background-color:inherit;
/*color:#952b2b;*/
color:#fadd1e;
/*color:#cdc;*/
text-decoration:none;
}

#logo a:hover{
background-color:inherit;
color:#adc;
/*color:#69e;*/
}

/* Warning about You have no background-color with your color : #tagline
   is a known issue, but does not work properly in all browsers
#tagline{
background-color:inherit;
color:#26a;
text-align:center;
font-size:1.3em;
}
*/

#intro p{
line-height:1.5em;
}

#main{
float:left;
width:600px;
margin-right:20px;
padding:0;
}

#widemain{
float:left;
width:680px;
margin-right:20px;
padding:0;
}

.headerstyle{
display:block;
margin: 30px 0 10px 0;
padding:5px 0 5px 8px;
background:#eee url(img/gradient2.png) repeat-x;
color:#222;
border-top:1px solid #ddd;
border-right:1px solid #bbb;
border-bottom:1px solid #bbb;
border-left:1px solid #ddd;
text-decoration:none;
}

.headerstylenotopmargin{
display:block;
margin: 0px 0 10px 0;
padding:5px 0 5px 8px;
background:#eee url(img/gradient2.png) repeat-x;
color:#222;
border-top:1px solid #ddd;
border-right:1px solid #bbb;
border-bottom:1px solid #bbb;
border-left:1px solid #ddd;
text-decoration:none;
}

#sidebar{
width:155px;
float:right;
margin-top:20px;
font-size:1em;
line-height:1.3em;
}

#sidebar p{
font-size:0.9em;
}

.sidelink{
display:block;
width:140px;
margin:3px 10px 2px 0;
padding:5px 0 5px 8px;
font-size:1.1em;
font-weight:bold;
text-align:left;
background:#eee url(img/gradient1.png) repeat-x;
color:#26c;
border-top:1px solid #ddd;
border-right:1px solid #bbb;
border-bottom:1px solid #bbb;
border-left:1px solid #ddd;
}

.sidelink:hover,.menuheader{
background:#fff url(img/gradient2.png) repeat-x;
color:#222;
border-top:1px solid #ddd;
border-right:1px solid #888;
border-bottom:1px solid #888;
border-left:1px solid #ddd;
text-decoration:none;
}

#footer{
margin:0 auto 20px auto;
width:760px;
background:#fff url(img/footerbg.png) bottom left no-repeat;
padding:0 0 5px 0;
font-size:0.9em;
color:#888;
text-align:center;
}

h1,h2,h3,h4{
margin:0 0 10px 0;
font-weight:normal;
}

h1{
font-size:2.8em;
}

h2{
margin:0 0 4px 0;
font-size:1.8em;
}

h3{
margin:20px 0 8px 0;
font-size:1.4em;
}

h4{
margin:10px 0 5px 0;
font-size:1.2em;
}

.clear{
clear:both;
margin:0;
}

.right{
text-align:right;
}

.internallink{
font-size:0.9em;
text-align:center;
}

.block{
padding:20px;
background:#eee;
color:#222;
border:2px solid #ddd;
}

.credit{
color:#888;
background-color:inherit;
}

.hide{
display:none;
}

.introheader{
margin:60px auto 60px auto;
}

/* Added by Richard Kulju for forms */
label,input, select {
	display: block;
	width: 150px;
	float: left;
	margin-bottom: 10px;
}

label {
	text-align: left;
	width: 75px;
	padding-right: 20px;
}

.inlinelabel{
	padding-left: 20px;
}

/* used to position the second label in an iframe */
.iniframelabel{
	position: absolute;
	left: 200px;
}	

#clid{
	width: 75px;
}

.longlabel {
	width: 175px;
}

.mediumlabel {
	width: 100px;
}

.thirtycharwide{
	width: 220px;
}

.fifteencharwide{
	width: 110px;
}

.sixcharwide{
	width: 30px;
}

.blanklabel{
	width: 1px;
	padding-right: 3px;
}

.shortlabel{
	width: 10px;
}

br {
	clear: left;
}

/*phone number formatting*/
#npa, #nxx {
width: 22px;
}

#xxxx, #ext{
width: 30px;
}

#register_id, #com_id{
width: 43px;
}

.namebox{
width: 140px;
}

#classform a{
padding-left: 20px;
}

#attendee_group{
background-color: AliceBlue;
float: left;
padding-bottom: 30px;
padding-right: 95px;
}


/* Use this for a npa nxx xxxx style phone form group */
#phonediv{
padding-top: 30px;
}

#phonediv .inlinelabel{
width: 10px;
}

#second_attendee{
margin: auto auto 20px auto
}

#classlistdiv select{
width: 350px;
height: 150px;
}

#shorterclasslistdiv select{
width: 350px;
height: 100px;
}

#classlist_single select{
width: 350px;
}

#clear{
float: right;
}

.checkbox{
width: 10px;
}

#noreg{
width: 110px;
}

input.button{
background-color: SkyBlue;
font-weight: bold; 
font-size: 12px; 
color: black;
}


select.select{
background-color: AliceBlue;
}

th{
width: 35px;
max-width: 35px;
}

td{
width: 35px;
max-width: 35px;
font-size:10px;
}

/*
Column styles for the Training Report Table
*/
.committeecolumn{
width: 150px;
max-width: 150px;
margin-right: 15px;
}

.attendeecolumn{
width: 100px;
max-width: 100px;
}

.phonecolumn{
width: 120px;
max-width: 120px;
}

.emailcolumn{
width: 60px;
max-width: 60px;
}

.timecolumn{
width: 60px;
max-width: 60px;
}

.notescolumn{
width: 10px;
max-width: 10px;
}

span.notetxt{
display: none;
}

.tablerowpad{
height: 20px;
}

a{
color: black;
}
a:hover{
color: blue;
text-decoration: none;
}

th{
text-align: left;
}

/* div for criteria list in the output report */
#criteria{
width: 350px;
height: 120px;
background-color: AliceBlue;
overflow: auto;
}


#criteria_container{
float: right;
}

#breakdowndiv{
float: left;
}

#breakdowntable{
width: 325px;
height: 120px;
background-color: AliceBlue;
}

span.noregdate{
font-style: italic;
color: 	#808080;
}

/* When we grey stuff out the hover doesn't work since we greyed out this 
noregdate class.  If we inherit the parent style we get our blue hover back */
span.noregdate:hover{
color: inherit;
}


/*The committe ID column in the report */
td.idnumcolumn:hover{
color:blue;
text-decoration: none;
}


input.text, input.namebox, input.iniframenamebox, input.sixcharwide, input.fifteencharwide{
background-color: white;
border: 1px solid darkseagreen;
}

/*used to position the second namebox in an iframe */
input.iniframenamebox{
position: absolute;
left: 200px;
}

#previewWin{
background-color: AliceBlue;
width: 400px;
height: 100px;
font: .8em arial, helvetica, sans-serif;
padding: 5px;
position: fixed;
left: 100 px;
top: 100 px;
visibility: hidden;
border: 1px blue solid;
}

span.italics{
font-style: italic;
}

span.smallfont{
font-size: xx-small;
}

/* For forms that go in other web pages, ie into an iframe */
#password_webform{
background-color: AliceBlue;
height: 440px;
}

#classreg_webform{
background-color: AliceBlue;
height: 470px;
width: 525px;
}

/*clean up the all caps from the database to make things display pretty */
.capsclean{
color: blue;
font-weight: bold;
}

#email_address_div{
background-color: #e5f0ff;
height: 100px;
padding: 0px 0px 10px 0px;
}

#classreg_webform   .darktone{
background-color: #e5f0ff;
height: 180px;
width: 430px;
padding-top: -200px;
}

#calendardates {
width: 300px;
font: .8em arial, helvetica, sans-serif;
}

#calendardates tr td {
width: 50%;
}

#classlist_single {
padding: 0px 10px 0px 10px;
}

.standardmsg {
font-weight: bold;
color: #FFFFFF;
}

.errormsg {
font-weight: bold;
color: red;
}

#dropped_report {
text-align: center;
}

#dropped_report a {
font-weight: bold;
font-size: 200%;
color: red;
}