@charset "UTF-8";
/* CSS Document */

.hubContentContainer{
	max-width:980px;
	background:#ededed;
	min-height:400px;
	padding:20px;
	margin:0 auto;
	font-family:"Roboto Condensed",sans-serif;
}
.hubContentContainer img{
	width:100%;
	height:auto;
}
.hubContentContainer h2{
	font-size:20px;
	font-weight:300;
	color:#525455;
	margin:0;
}
.hubContentContainer h3{
	font-size:16px;
	font-weight:400;
	color:#1c68ac;
	margin:0 0 10px 0;
}
.hubContentContainer h3 a{
	color:#1c68ac;
	text-decoration:none;
	font-family:"Roboto Condensed",sans-serif !important;
	transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
}
.hubContentContainer h3 a:hover{
	color:#999;
	text-decoration:underline;
}
.hubContentContainer h3.bottomArticle{
	margin:10px 0 10px 0;
}
.hubContentContainer .publishDetail{
	font-size:14px;
	font-weight:300;
	color:#525455;
	margin:0 0 10px 0;
}
.hubContentContainer .articleText{
	font-size:13px;
	font-weight:400;
	color:#77797a;
	margin:0 0 10px 0;
}
.hubContentContainer .divide-bottom{
	margin-bottom:20px;
}
.hubContentContainer .topHeader{
	border-bottom:1px solid #c4c4c4;
}
.hubContentContainer .topHeader p{
	font-size:24px;
	font-weight:100;
	color:#525455;
	margin:0 0 10px 0;
}
.hubContentContainer .topHeader p a{
	text-decoration:none;
	font-family:"Roboto Condensed",sans-serif;
}
.hubContentContainer .topHeader p a span{
	color:#525455;
	transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
}
.hubContentContainer .topHeader p a:hover span{
	color:#999;
	text-decoration:underline;
}
.hubContentContainer .topHeader .mainTitle p span,
.hubContentContainer .topHeader .subTitle p span
{
	color:#1c68ac;
	font-weight:500;
}
.hubContentContainer .topHeader .subTitle p{
	color:#1c68ac;
	font-size:20px;
	text-align:right;
	vertical-align:middle;
}
.hubContentContainer .articles .subArticle{
	padding-left:3.5em;
	min-height:540px;
}
.hubContentContainer .articles .subArticle .wrapper{
	position:relative;
}
.hubContentContainer .articles .mainArticle .wrapper,
.hubContentContainer .articles .subArticle .wrapper
{
	background:#fff;
	min-height:510px;
	padding:15px;
	width:auto;
}
.hubContentContainer .articles .mainArticle.topheader .wrapper
{
	background:#fff;
	padding:15px 15px 0px 15px;
	min-height:0px;
	border-bottom:none;
}
.hubContentContainer .mainArticle .articleContainer
{
	border-bottom:1px dashed #cfcfcf;
	padding:20px 0 20px 0;
}

.hubContentContainer .mainArticle .articleContainer.noborder
{
	border-bottom:0;
} 
.hubContentContainer .subArticle .subArticleContainer{
	border-top:1px dashed #cfcfcf;
	padding:18px 0 18px 0;
}

.hubContentContainer .subArticle .subArticleContainer.last
{
	border-bottom:1px dashed #cfcfcf;
}
.hubContentContainer .subArticle .subArticleContainer.readAll
{
	bottom:0;
	position:absolute;
	border-top:0;
}
.hubContentContainer .mainArticle .articleContent{
	min-height:196px;
	position:relative;
}
.hubContentContainer .mainArticle .articleContainer a img{
	transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
}
.hubContentContainer .mainArticle .articleContainer a:hover img{
	opacity:0.9;
}
.hubContentContainer .mainArticle .articleContent h3{
	font-weight:500;
	font-size:19px;
	line-height:20px;
	margin-top:-3px;
	margin-bottom:5px;
}
.hubContentContainer .button{
	padding:10px 15px;
	border:2px solid #1c68ac;
	text-transform: uppercase;
	color:#1c68ac;
	/*position:absolute;
	bottom:0;
	bottom:-1px;*/
	text-align:center;
	margin-top:10px;
}
.hubContentContainer .button:hover{
	background:#ededed;
	cursor:pointer;
}
.hubContentContainer .button a{
	text-decoration:none;
	color:#1c68ac;
	font-size: 14px;
    font-weight: 500;
	font-family:"Roboto Condensed",sans-serif;
}

.hubContentContainer .button a::after{
	content: "";
    display: block;
    float: right;
    height: 12px;
    margin: 3px 0 0 10px;
    width: 13px;
}
.hubContentContainer .button a:after{
	background-image: url("//www.chainreactioncycles.com/static/design/images/crc-sprite.png");
    background-position: -33px -613px;
}
.grid-wrap {
  margin-left: -3em;
  overflow: hidden;
  clear: both; 
  }
  
.grid-wrap-nomarg {		
  overflow: hidden;
  clear: both; }
  
.grid-col {
  float: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; 
  }

.grid-col-pad {
  float: left;
  width: 100%;
   padding-left:1em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }


/*---- Column Layout -----*/ 
.col-full,
.col-set-full .grid-col {
  width: 100%; }

.col-one-half,
.col-set-one-half .grid-col {
  width: 50%; }

.col-one-third,
.col-set-one-third .grid-col {
  width: 33.333%; }

.col-one-quarter,
.col-set-one-quarter .grid-col {
  width: 25%; }

.col-two-thirds {
  width: 66.666%; }

.col-three-quarters {
  width: 75%; }

/* -- Breakpoint (.bp1)
------------------------------------------------------------- */
@media only screen and (min-width: 30em) {
.bp1-col-full,
.bp1-col-set-full .grid-col {
    width: 100%; }

.bp1-col-one-half,
.bp1-col-set-one-half .grid-col {
    width: 50%; }

.bp1-col-one-third,
 .bp1-col-set-one-third .grid-col {
    width: 33.333%; }

.bp1-col-one-quarter,
.bp1-col-set-one-quarter .grid-col {
    width: 25%; }

.bp1-col-two-thirds {
    width: 66.666%; }

.bp1-col-three-quarters {
    width: 75%; }
		 		
}
@media only screen and (max-width: 30em) {
.grid-wrap-nomarg {	
  margin-left: -0.4em;
  overflow: hidden;
  clear: both; }

.grid-col{
	height:auto;
	min-height:0;
	margin-bottom:10px;
}
.hubContentContainer .articles .subArticle{
	padding-left:0;
}
.hubContentContainer .topHeader .subTitle p{
	text-align:left;
}
}
/* -- Breakpoint 2 (.bp2)
------------------------------------------------------------- */
@media only screen and (min-width: 48em) {
.bp2-col-full,
.bp2-col-set-full .grid-col {
    width: 100%; }

.bp2-col-one-half,
.bp2-col-set-one-half .grid-col {
    width: 50%; }

.bp2-col-one-third,
.bp2-col-set-one-third .grid-col {
    width: 30.333%; }

.bp2-col-one-quarter,
.bp2-col-set-one-quarter .grid-col {
    width: 25%; }

.bp2-col-two-thirds {
    width: 66.666%; }

.bp2-col-three-quarters {
    width: 75%; } }
@media only screen and (max-width: 48em) {
.grid-wrap-nomarg {	
  margin-left: -0.4em;
  overflow: hidden;
  clear: both; }

.grid-col{
	height:auto;
	min-height:0;
	margin-bottom:10px;
}
.grid-col-pad{
	height:auto;
	min-height:0;
	margin-bottom:10px;
	padding-left:0;
}
.hubContentContainer .articles .subArticle{
	padding-left:0;
}
.hubContentContainer .topHeader .subTitle p{
	text-align:left;
}
}	

/* -- Breakpoint 3 (.bp3)
------------------------------------------------------------- */
@media only screen and (min-width: 60em) {
.bp3-col-full,
.bp3-col-set-full .grid-col {
    width: 100%; }

.bp3-col-one-half,
.bp3-col-set-one-half .grid-col {
    width: 50%; }

.bp3-col-one-third,
.bp3-col-set-one-third .grid-col {
    width: 33.333%; }

.bp3-col-one-quarter,
.bp3-col-set-one-quarter .grid-col {
    width: 25%; }

.bp3-col-two-thirds {
    width: 66.666%; }

.bp3-col-three-quarters {
    width: 75%; } }