/* 2013 mar 22 */
/*.invisible {
	visibility: hidden;
}*/

/* modernizr */
.no-js #showtell {
	display: none;	
}
.no-js #html-version-controls {
	display: none;	
}

div #content h1 {
	display:none;
}

/*web acessible button*/
.button {
	font-size: 0.8em;
	/*padding-right: 10px;
	padding-left: 10px;*/
	background-color: #fff;
	/*border: 1px solid #d7d7d7;*/
	color: #000;
	display:block;
	height: 3em;
	line-height:1em;
	width: 260px;
	background-image: url('../images/tab-version-select.png');
	background-repeat: no-repeat;
	padding-top: 20px;
	text-align: center;
	text-decoration:none;
}
.button:hover {
	background-color: #fff;
}



h1 {
	font-weight:normal;
}


#hub  { 
	color:#333;
	font-family:Arial;
	font-size:12px;
	font-weight:normal;
	max-width:1200px;
	padding:0;
	margin:20px 0 0 0;
	line-height: 1.5em;
	
}
#hub #container{
	max-width:1200px;
	margin: 0 auto ;
}

#hub #flashcontentdiv {
	width: 100%;
	height: 600px;
}



#flashContent { max-width:1200px; max-height:704px; background-color:#fff; }


#hub header{
	max-width:1024px;
	width:100%;
	height:100px;
	background-color: none;
	overflow:hidden;
	}
#hub  img{
	border:0;
	/* padding-bottom: 40px; 
	padding-right: 10px; */
	width:auto;
	}
	
	#hub .module-poster h3 {
	min-height: 40px;
	border-bottom: 2px solid #ccc;
	background-color:rgba(0,0,0,0.1)
	}
	
	#hub .module-poster p {
	min-height: 30px;
	}
	
	#hub .module-poster p.background-accent {
	min-height: 40px;
	border-top: 2px solid #9CF;
	
	}
	
	.background-ltgrey {
    min-height: 40px;
	border-top: 1px solid #666;
	background-color: #eee !important;
    color: black !important;
}

.background-ltgrey a, .background-ltgrey a:visited {
    color: black !important;
	text-decoration: underline;
}

.background-ltgrey a:hover {
	text-decoration: none;
}

#hub .border-right {
	border-bottom: 5px solid #C63;
	height: 5px;
}
	
	
#hub h2 img {
	padding:0;
	}

/* quicks */
#hub h2.quicks-header {
	font-size:30px;
	margin:0;
	padding:0;
	background-image:url('../images/section-divider-tab.png');
	background-repeat:no-repeat;
}

#hub .quicks-collection {
	padding:0;
	margin-top:0;
}

#hub .quicks-collection h3 {
	font-size:18px;
	color:#666;
	margin: 0 0 10px 0;
	padding: 0 0 0 10px;
}
#hub .quick {
	background-color:none;
	width:32%; /* must factor in the margin */
	 margin:0 1% 14px 0; /* vertical measurements in pixels */
	 padding:0;
	 min-width:100px; 
	 float:left;
	 border-left:6px solid #369;
}
#hub .quicks-collection ul {
	margin:0;
	padding:0 0 0 16px;
 }
 /* marked for deprecation:
#hub .quicks-collection img{
	float:left;
	width:30px;
	height:30px;
	margin-right:8px;
	}
*/
#hub .quicks-collection li{
	margin:0;
	padding:4px 0;
	/*display:block;*/
	/*min-height:34px;*/
	list-style-type:none;
}
#hub .quicks-collection a{
	color:#666;
	padding-left:8px;
	font-size:12px;
	text-decoration:none;
	font-weight:bold;
}
#hub .quicks-collection a:hover{
	color:#000;
	text-decoration:underline;
}


#hub .quicks-collection p{
	margin:0;
	padding-left:40px;
	font-size:14px;
}


/* topics */

#hub h2.topic-collection-header {
	font-size:30px;
	color:#333;
}
#hub .topic-collection {
	padding:10px 0;
	margin-top:10px;
}
#hub .topic {
	 background-color:none;
	 min-width:120px; 
	 width:24%; /* must factor in the margin */
	 margin:0 1% 14px 0; /* vertical measurements in pixels */
	 float:left;
 }
#hub .topic img {
	float:left;
	background-color:none;
	width:60px;
	height:60px;
	vertical-align:text-top;
	margin-right:8px;
	}
	
#hub .topic > .description {
	margin:0;
	padding-left:80px;
	display:block;
}
#hub .topic h3{
	margin:0;
	padding:0;
	font-size:16px;	
	font-weight:bold;
}

#hub .topic p {
	font-size:11px;	
	margin:0;
	text-indent:0;
	padding:0;
	line-height:1.25em;
}
#hub  ul .topic{
	list-style-type:none;
}

#hub .topic a{
	color:#333;
	text-decoration:none;
}
#hub .topic {
	color:#000;
}


	
.module-collection  a:visited{
	color:#000;
		
}

.topic-collection {
	color:#fff;	
	}

/* module description */
#hub .module-collection {
	padding:10px 0 10px 0px;
	margin-top:10px;
}
#hub .module {
	 background-color:transparent;
	 outline: none !important;
	 width:32%; /* must factor in the margin */
	 margin:0 1% 14px 0; /* vertical measurements in pixels */
	 min-width:280px; 
	 height:150px;
	 float:left;
	 margin-bottom: 10px;
	 	
 }
 
 
 #hub .module .image-cont {
	height: 100%;
	float:left;
	background-color:none;
	vertical-align:text-top;
	/* margin-right:0px; */
	
	}
 
#hub .module img.icon {
	
	
	width:90px;
	height:90px;
	
	border-right: 6px solid #000;
	}
	
	
	
#hub .module > .description {
	margin:0 0 0 10px;
	padding-left:60px;
	padding-bottom: 10px;
	display:block;
		line-height: 1.5em;
}

#hub .cat-wrap h2 {
	margin:0 0 0 20px;	
}

#hub .module h3{
	margin:0;
	padding:0 0 4px 0;
	font-size:18px;	
	font-weight:bold;
		line-height: 1.1em;
}

#hub .description a {
	border-top: 1px dotted #ccc;
	font-size:14px;
	}

#hub .description a:link {
	text-decoration:none;
	color:#666;
	}

#hub .description a:visited {
	text-decoration:none;
	color:#666; 
	}

#hub .description a:hover {
	text-decoration:underline;
	color:#333; 
	}
	
#hub .description a {
	margin:0;
	position: relative;
	left: 10px;
	/*display:inline-block;*/
	font-weight:bold;
	}
	
#hub .module p {
	font-size:12px;	
	margin:0 0 10px 0;
	text-indent:0;
	padding:0;
	line-height:1.25em;
}

/*#hub .module .getstarted {
	border:0;
	margin:0;
	line-height:50px;
	padding:10px 40px 10px 0;
	color:#000;
	text-decoration:none;
	font-size:16px;
	background-image:url(../images/icons/btn-start.png);
	background-position: right center;
	background-repeat:no-repeat;
	
	}
*/
#hub  ul .module {
	list-style-type:none;
}
	
#hub h4 {
	 font-size:22px;
	 width:99%;
	 margin:0;
	 padding: 60px 0 0 0;
	 font-weight:normal;
	 font-family:Arial;
	 float:left;
	 background-image:url('../images/section-divider-tab.png');
	 background-repeat:no-repeat;
}

#hub h2 .large {
	font-size:30px;
}

#hub h2 hr {
	border:0;
	margin:0;
	padding:0;
	border-top:1px solid #00d;
	height:2px;
	}

#hub h4 img {
	float:left;
	background-color:none;
	width:80px;
	height:80px;
	margin-right:16px;
	margin-left:16px;
	vertical-align:center;
}

#hub  .clearfix{
	clear:both;
	height:1px;
	}
	
/* CSS Classes for layout of sections on hub page w/ img icon- MS - Oct 31 2013 - BEGIN  */

#hub ul {

padding-left: 0px;
margin-left: 0px;
}

#hub li {
	list-style: none;
	list-style-type: none;
padding: 0px;
margin: 0px;
display: block;
}


.cat-wrap  {
		font-size:16px;
	 	width:99%;
	 	margin:0 0 0 0;
	 	padding: 60px 0 0 0;
	 	font-weight:normal;
	 	font-family:Arial;
	 	float:left;
background-image:url('../images/section-divider-tab.png');
	 background-repeat:no-repeat;
	 margin-left: 2px;
		}

.cat-wrap img {
width: 80px;
}

.cat-left {
    float: left;
 }

#hub .cat-wrap h2 {
	padding-top: 10px; 
	background-image:none;
	overflow: hidden; 
	margin-top: 15px;
	font-size: 18px;
		line-height: 29px;
}

#hub .beta-whatsnew span
{
color: #369;
font-size: 26px;
font-weight: bold;
}

#hub .cnsc span
{
color: #369;
font-size: 26px;
font-weight: bold;
}

#hub .medicine span
{
color: #009999;
font-size: 26px;
font-weight: bold;
}

#hub .nuclearpower span
{
color: #0c7db6;
font-size: 26px;
font-weight: bold;
}

#hub .mining span
{
color: #8c6c34;
font-size: 26px;
font-weight: bold;
}

#hub .radiation span
{
color: #c30;
font-size: 26px;
font-weight: bold;
}

#hub .history span
{
color: #06c;
font-size: 26px;
font-weight: bold;
}

#hub .challenges span
{
color: #666;
font-size: 26px;
font-weight: bold;
}


#hub .transport span
{
color: rgb(95, 124, 131);
font-size: 26px;
font-weight: bold;
}

/* CSS Classes for layout of sections on hub page w/ img icon- MS - Oct 31 2013 - END  */

#showtell .tag h2{
	color:#fff;
	font-size: 16px;
}

#showtell .tag h3{
	color:#fff;
}

#showtell .tag p {
	color:#fff;
}

#showtell .tag a, #showtell .tag a:visited {
	color:#fff !important;
	text-shadow: none;
}
#showtell .tag a:hover {
	text-decoration: underline;
}

#hub .michael-image {
	width:30%;
	float:left;
	/*max-width:90px;*/
}
#hub .michael-descr {
	width:65%;
	float:left;
	min-height:200px;
}


a#abracadabra.button {
border-style:none;
width: 320px;
padding: 24px 10px 0px 10px !important
}

a#abracadabra.button:hover {
border-style:none;
padding: 24px 10px 0px 10px !important;
    background-position: 0 0px !important;
}

#wb-main h2 { 
line-height: 1.4em !important;
font-weight: 400;
}

@media screen and (max-width:767px) {
	#hub .michael-image {
		width:30%;
		float:left;
		/*max-width:90px;*/
	}
	#hub .michael-image img{
		max-width:90px;
		
	}
	#hub .michael-descr {
		width:69%;
		float:left;
		min-height:140px;
	}
	
	#hub .cat-wrap h2 {
	margin:0 0 0 20px;	
		padding-left:20px;
}
	
}

 
 @media screen and (max-width:1024px) {
	#hub .module {
		width:32%;
	}
	
			#hub .module >.description{
		padding-left:96px;
					margin:0 0 0 10px;
		}
	
	
	#hub .cat-wrap h2 {
	margin:0 0 0 20px;	
		padding-left:20px;
}
	
}

	
@media screen and (max-width:800px) {
	
	#hub .module {
		width:45%;
		min-width:240px;
		
	}
	#hub .module-collection {
		padding-left:0px;
	}
	#hub .module img{
		width:90px;
		height:90px;
		}
	#hub .module img.icon{
		width:90px;
		height:90px;
		}
	#hub .module>.description{
			margin:0 0 0 10px;
		}
	#hub .topic {
		width:32%; /* must factor in the margin */
	}
	
	#hub .cat-wrap h2 {
	margin:0 0 0 20px;	
		padding-left:20px;
}
}

 @media screen and (max-width:640px) {
	#flashcontentdiv {
		display:none;
		}
	#showtell {
		display:none;
	}
	#hub {
		margin-top:10px;
	}
	#hub .module {
		width:99%;
			margin:0 0 0 10px;
		height:auto;
	}
	#hub .module-collection {
		padding-left:0;
	}
	
	#hub .module img.icon{
		width:90px;
		height:90px;
		/*border-right:0;*/
		}
	#hub .module>.description{
		padding-left:96px;
					margin:0 0 0 10px;
		}
	#hub .topic {
		width:48%; /* must factor in the margin */
		min-height:50px;
	}
	#hub .topic img {
		width:40px;
		height:40px;
	}
	#hub .topic > .description {
		padding-left:40px;
	}
	
	#hub .cat-wrap h2 {
	margin:0 0 0 20px;	
	padding-left:20px;
}


}

 @media screen and (max-width:480px) {
	#hub .quick {
		width:100%;
	}
	
		#hub .module>.description{
		padding-left:96px;
					margin:0 0 0 10px;
		}
		
		#hub .cat-wrap h2 {
	margin:0 0 0 20px !important;	
	padding-left:20px;
}
}




	