/*******************************************************************************
* noyce_style.css
*******************************************************************************/

html {
    height: 100%;
}

body {
    background-color: #d9d9d9;
    margin: 0px;
    padding: 0px;
    text-align: center;
    height: 100%;
    background-image: url(../img/bg.gif);
    font-size:12px;
    font-family:Verdana, Arial, Helvetica, sans-serif;
}



#outerContainer {
	width: 757px;
	margin-left: auto;
    margin-right: auto;
    margin-top:-32px;
}

#middleContainer {
    margin-left: auto;
    margin-right: auto;
    margin-top:18px;
    width: 757px;
    background-image: url(../img/shadow_bg.gif);
}



#innerContainer {
    text-align: left;
    width: 737px;
    background-color: #ffffff;
    /*background-image: url(../img/contentbg.gif);*/
    margin-left: auto;
    margin-right: auto;
    margin-top:18px;
    padding:6px;
    color:#1B96E2;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/****
* Header
****/

#header {
	margin:0;
	width: /*760px;*/100%;
	height: 39px;
	background-image: url(../img/ecrw_header.gif);
	background-repeat: no-repeat;	
	background-color:#ffffff;
}

/***************
* navigation
**************/

#navigation {
    width: 723px; height: 37px;
    margin: 0; padding: 0;
    /*clip: rect(0, 761px, 31px, 0);*/
}


#breadcrumb {
	width:700px;
	font-size:10px;
	margin:2px;
	padding-top:2px;
	color:#999999;
	letter-spacing:.05em;
}

#breadcrumb a {
	color:#666666;
}

#navigation li {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    top: 0;
    height: 31px;
}



/****************************************
* Content Area
*****************************************/

#content {
    /*width: 573px;*/
    width:100%;
    background-color: #ffffff;
}

#content .contentpad {
    padding: 15px 10px 10px 25px;
    position: relative;
    
}

#content #indexpad {
    padding: 20px 25px 10px 20px;
    position: relative;
}

#content h1#mainhead {
    height: 30px;
    overflow: hidden;
    padding-top: 30px;
    height: 0px !important;
    height /**/: 30px;
    margin-bottom: 0.4em;
}


#content p {
	line-height: 1.4em;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    color: #1B96E2;
    margin: 8px 32px 4px 2px;
    vertical-align: top;
}

#content p.mainText {
	line-height: 1.4em;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    color: #1B96E2;
    margin: 8px 12px 4px 2px;
    vertical-align: top;
}



#content h2 {
    font: bold 1.2em Verdana, Arial, Helvetica, sans-serif;
    color: #964231;
    margin: 0px;
}

#content h3 {
    font: 1.1em Verdana, Arial, Helvetica, sans-serif;
    color: #4f6f40;
    margin:0;
}

#content h3.profdev {
	margin-top:-10px;
}

#content h4.profdev {
	font: 0.92em Verdana, Arial, Helvetica, sans-serif;
	color: #4f6f40;
	margin-top:-10px;
	font-style:italic;
	font-weight:lighter;
	width:90%;
}

#content blockquote {
    margin: 0; padding: 0;
}

#content blockquote p {
    margin-top: 1em;
    margin-bottom: 0;
}

#content .index_main {
    position: relative;
    margin: 0;
    padding: 0;
    /*width: 538px;*/
    width:100%;
    clear:both;
}

#content .main {
    position: relative;
    margin-bottom: 4px;
    padding-bottom:2px;
    /*width: 538px;*/
    width:100%;
    clear:both;
}

#content .index_section {
    position: relative;
    padding: 0.8em 0 0 0;
    margin: 20px auto 0 auto;
    /*border: 1px solid #ffffff;*/
    border-top: 1px dashed #D9D9D9;
    /*width: 538px;*/
    width: 97%;
}

#content .section {
    position: relative;
    padding: 0.8em 0 0 0;
    margin: 0 auto 0 auto;
    /*border: 1px solid #ffffff;*/
    border-top: 1px dashed #D9D9D9;
    /*width: 538px;*/
    width: 97%;
}

#content .section_sub {
	margin:2px 2px 0 24px;
	width:90%;
}

#content #bottom {
	margin:12px 0 0 10px;
	overflow:hidden;
}

#content .index_main a:link, a:active, a:visited {
	color:#666666;
	text-decoration:underline;
	background-color:transparent;
}

#content .index_main a:hover {
	color:#333333;
	text-decoration:underline;
	background-color:transparent;
}

.bodylink a:link {
	color:#666666;
	text-decoration:none;
	background-color:transparent;
}

.bodylink a:visited {
	color:#666666;
	text-decoration:none;
	background-color:transparent;
}

.bodylink a:hover {
	color:#333333;
	text-decoration:underline;
	background-color:transparent;
}

#bottom .bottom_links {
	text-align:left;
	margin:8px 0 0 2px;
}

#bottom .logos {
	margin:-24px 0 0 0;
	position:relative;
	left:160px;
	text-align:left;
}

#bottom a.bottomLink:link {
	color:#999999;
	text-decoration:none;
	background-color:transparent;
}

#bottom a.bottomLink:visited {
	color:#999999;
	text-decoration:none;
	background-color:transparent;
}

#bottom a.bottomLink:hover {
	color:#333333;
	text-decoration:underline;
	background-color:transparent;
}

#bottom a.bottomLink:active {
	color:#333333;
	text-decoration:underline;
	background-color:transparent;
}

#content hr {
	border: none;
	margin-bottom:-2px;
	margin-top:2px;
	border-top: 1px dashed #d9d9d9;/*the border*/
	width: 99%;
	height: 1px;/*whatever the total width of the border-top and border-bottom equal*/
}

#content hr.index {
	margin-top: -4px;
}

#content .tabHeaderText {
	color:#990000;
	font-size:18px;
	position:relative;
	top:-7px;
	left:8px;
	background:transparent;
	/*padding-right:144px;*/
}

#indexBlock {
	 color:#999999;
	 margin:0 6px -70px 4px;
	 font-size:12px;
	 overflow:hidden;
}

#indexBlockTop {
	 border:none;
}

#indexBlockBottom {
	 border-top: 1px dashed #D9D9D9;
	 margin-top:-90px;
}

#indexBlock .indexHeaderText {
	color:#1B96E2;
    font: normal 14px Verdana, Arial, Helvetica, sans-serif;
    margin:0 0 0 1px;
    padding-bottom:8px;
}

#indexBlock .sectionText {
	margin:0 4px 4px 14px;
	line-height:1.5em;
}

#indexBlock .indexBlockAbout {
	 border-right: 1px dashed #D9D9D9;
	 width:46%;
	 margin: 2px 15px 4px 4px;
	 padding:0 8px 0 0;
}

#indexBlock .indexBlockProfDev {
	padding:0 8px 0 0;
	margin: 0 15px 4px 12px;
	position:relative;
	top:-118px;
	left:350px;
	width:49%;
}

#indexBlock .indexBlockClassroom {
	 border-right: 1px dashed #D9D9D9;
	 width:46%;
	 margin: 12px 15px 4px 4px;
	 padding:0 8px 0 0;
}

#indexBlock .indexBlockLogo {
	padding:0 8px 0 0;
	margin: 12px 15px 4px 12px;
	position:relative;
	top:-100px;
	left:350px;
	width:49%;
}

#indexBlock .noyce_logo {
	margin-bottom: 8px;
}

#indexBlock a:link, a:active, a:visited {
	color:#666666;
	text-decoration:underline;
	background-color:transparent;
}

#indexBlock a:hover {
	color:#333333;
	text-decoration:underline;
	background-color:transparent;
}

#indexBlock a.indexHeaderLink:link {
	text-decoration:none;
	color:#1B96E2;
}

#indexBlock a.indexHeaderLink:visited {
	text-decoration:none;
	color:#1B96E2;
}

#indexBlock a.indexHeaderLink:hover {
	text-decoration:underline;
	color:#1B96E2;
}

#indexBlock a.indexHeaderLink:active {
	text-decoration:underline;
	color:#1B96E2;
}

#content .maintab {
	width:695px;
	height:28px;
	margin-left:4px;
	background-color:#E4E7DA;
}

table {
	width:95%;
	margin: 8px 0 0 2px;
	border:0;
	border-spacing:2px;
}

tr {
	border:0;
}

td {
	padding-bottom:8px;
	margin:0;
}

table.transcripts {
	width:100%;
	margin: 4px 0 0 0;
	border-spacing:2px;
}

table.transcripts td {
	vertical-align:top;
	padding: 2px;
}

table.transcripts td.subject {
	background-color:#dddddd;
}

table.transcripts td.text {
	background-color:#eeeeee;
}

#content table#videos {
	width:695px;
	border-spacing:0;
	margin: 8px 0 8px 2px;
	border:0;
}

#videos tr {
	background-color:#E4E7DA;
	border:0;
}

#videos td {
	color:#999999;
	text-align:center;
	font-size:10px;
	padding-bottom:12px;
}

#videos td.thumbs {
	margin-bottom:12px;
}


/* Classroom Examples section */

div#classroompad {
    padding: 25px 25px 10px 20px;
	display:inline;
}

div#tab_classroom {
	height:28px;
	display:inline;
	margin-left:-22px;
}

div#videopad {
    padding: 25px 25px 10px 20px;
    position:relative;
    left:45px;
    top:-10px;
	display:inline;
}

iframe.videotabs {
	/*border:1px solid #d9d9d9;*/
	border:none;
	width:354px;
	height:312px;
	margin-left:-20px;
	margin-top:2px;
}

iframe.flashframe {
	border:none;
	width:340px;
	height:395px;
	overflow:hidden;
	float:left;
}

body.flashBG {
	background:#ffffff;
}

#classroompad p.mainText {
	color:#1B96E2;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    line-height: 1.8em;
    width:90%;
    padding-left:6px;
}

#classroomBlock {
	position:relative;
	top:-200px;
}



/* Videos */

div#flashVideoContainer {
	width:327px;
	height:385px;
	padding-top:6px;
	display:inline;
	float:left;
	color:#999999;
	font-size:12px;
    font-family:Verdana, Arial, Helvetica, sans-serif;
}

#flashVideoContainer .flash {
	margin:0 auto 0 auto;
	text-align:center;
	border:1px solid #d9d9d9;
	padding:2px;
	height:96%;
}

table.flash_video_thumbs {
	width:320px;
	margin:0 0 0 2px;
	border:0;
	font-size:9px;
}

table.flash_video_thumbs td {
	padding-bottom:2px;
	text-align:center;
}

.flash_curr_vid {
	color:#1B96E2;
}

.flash_curr_vid a:link { color: #666666; text-decoration:none; }
.flash_curr_vid a:visited {	color: #666666; text-decoration:none; }
.flash_curr_vid a:hover { color: #666666; text-decoration:underline; }
.flash_curr_vid a:active { color: #666666; text-decoration:underline; }

img.flash_curr_vid_thumb {
	border:1px solid black;
	text-decoration:none;
}


/* search */

#search {
	position:relative;
	left:530px;
	top:98px;
	width:200px;
	margin:1em 0 0 0;
	text-align:right;
	filter:alpha(opacity=40);
	opacity: 0.4;
	-moz-opacity:0.4;
}

#search:hover {
	filter:alpha(opacity=100);
	opacity: 1.0;
	-moz-opacity:1.0;
}

#search .text {
	color:#1B96E2;
	font-size:10px;
	margin:0 2px 0 0;
}

#search .searchimg {
	float:left;
	width:14px;
	height:13px;
	position:relative;
	top:4px;
}

#search input { 
	width:175px; 
	font-size: 0.85em; 
	background:#1B96E2;
	margin-top:2px;
	color:#d9d9d9
}

#search select { 
	width:175px; 
	font-size: 1.15em; 
	background:#1B96E2;
	margin-top:1px;
	color:#d9d9d9
}

/*******************************************************************************
* Images
*******************************************************************************/


div.paddedimage {
    float: left;
    margin: 2px 10px 0 0;
    padding: 8px;
    background-color: #F6F5F0;
    text-align: center;
}

div.paddedimage .text {
    margin: 0.4em auto 0 auto;
    text-align: center;
}

div.paddedimage .image {
    margin: 0;
    text-align: center;
}


#content #indexImage {
    float: left;
    margin-right: 15px;
    margin-top: 8px;
}

div#topImg_container {
	margin: 8px 36px 8px 8px;
	display:inline;
	float:left;
	border:1px solid #d9d9d9;
}

div#topImg_container_over {
	margin: 8px 36px 8px 8px;
	display:inline;
	float:left;
	border:1px solid #d9d9d9;
}

.indexImg {
	padding:2px;
}

.paddedimg {
	margin:2px 4px 4px 0;
}

img.border {
    border: 1px solid #d9d9d9;
}

img.flushright {
	float:right;
	position:relative;
}

img.flushleft {
	float:left;
	position:relative;
}

img.imglink {
	border:2px solid transparent;
}

img.imglink:hover {
	border:2px solid #990000;
}

/****************
* Footer
*****************/

#footer {
    clear: both;
    padding: 8px 0 8px 0;
    margin: 2px auto 2px auto;
    width: 75%;
    color:#999999;
    font-size:10px;
    text-align:center;
}

#footer a:link { color: #666666; text-decoration:none; }
#footer a:visited {	color: #666666; text-decoration:none; }
#footer a:hover { color: #666666; text-decoration:underline; }
#footer a:active { color: #666666; text-decoration:underline; }

table.profdev_practice {
	width:98%;
	margin: 8px auto 0 auto;
	border-spacing:8px;
}

table.profdev_practice td {
	vertical-align:top;
}

table.profdev_practice td.bottom {
	border-bottom:1px solid #d9d9d9
}

span.selected {
  background:#FFFFFF;
  color:#FFF;
}

span.title {
 	color:#ED2123;
  cursor:pointer
}

span.title2 {
 	color:#ED2123;
  cursor:pointer
}

#wall {
	line-height: 1.4em;
    font: normal 12px Verdana, Arial, Helvetica, sans-serif;
    color: #1B96E2;
    text-align:left;
}

#wall .header {
	font-weight:bold;
	font-size:14px;
}




/* Safari hack */
img.flushright {
top:-32px;#
}
