/* Blog styles */

/* Global 
=================================== */

	ul, li {
		padding: 					0;
		margin:						0;
		font-size: 					14px;
	}

	h1.page-header {
		padding: 					83px 0;
	}

	.blog-internal div#page h1.blog-header, .blog-internal div#page h1.news-header {
		display: 					inline-block;
	}

	.blog-internal div#page h1 {
		font-family:      			Verdana, Geneva, sans-serif;
		font-weight: 				normal;
		padding: 					0;
		color: 						#5b5b5b;
		font-size: 					30px;
		margin: 					40px 0;
		text-align: 				left;
		position: 					relative;
	}

	.blog .right-hand-menu h3, 
	.blog-internal .right-hand-menu h3 {
		margin: 					0 0 10px 0;
	}

	.blog .right-hand-menu h3:before, 
	.blog-internal .right-hand-menu h3:before {
		content: 					"";
		text-align: 				center;
		position: 					absolute;
		height: 					1px;
		width: 						85px;
		margin: 					40px 0 0 0;
		border-bottom: 				1px solid #f5a52a;
	}

	.blog-wrapper div#page h1, .blog h1.page-header {
		font-family:      			Verdana, Geneva, sans-serif;
		font-size:        			30px;
      	line-height:      			35px;
      	color: 						#545454;
      	text-align: 				left;
      	padding:                    0 0 20px 0;
	}


/* Architecture
=================================== */

	section.content {
		padding:                    35px 20px;
		margin-top: 				157px;
	}

	.internal-banner-blog, .internal-banner-testimonials {
	 	left: 						0;
	 	right: 						0; 
  	}

  	.internal-banner-blog {
    	background: 				url('https://asset.firstoption.com.au/images/modules/first-option-blog.jpg');
    	background-position: 		center;	
  	}

  	.internal-banner-testimonials {
    	background: 				url('https://asset.firstoption.com.au/images/modules/member-testimonials.jpg');
    	background-position: 		center;	
  	}

	section.content.blog-internal div#page {
		max-width: 					860px;
		margin-right: 				3.2%;
		float: 						left;
		width: 						72%;
		padding: 					0;
	}

 	div.blog, .blog-wrapper section.content div#page {
 		max-width: 					860px;
 		margin-right:       		3.2%;
 		float:                		left;
 		width: 						72%;
 		padding: 					0;
 	}

 	div.leading, div.article_column {
 		width: 						100%;
 		padding: 					80px 0 40px 0;
 	}

 	div.leading:first-child, div.column1 {
 		padding: 					0 0 40px 0;
 	}

  	.right-hand-menu {
  	  	float:                		right;
  	  	max-width:            		260px;
  	  	width:                		21.666%;
  	}

  			.blog-internal .right-hand-menu {
  				margin: 					30px 0 0 0;
  			}

	body.internal.large #topContainer, 
	body.internal.large #mainLeft, 
	body.large #leftContent, 
	body.internal.large #mainLeftInternal, 
	body.internal #mainContent {
		width: 						670px;
	}

	#mainContent {
		padding: 					40px 20px 0 0;
	}

	body.internal.large #mainOuter, 
	body.internal.large #mainContainer,
	body.internal #footerMiddle {
		width: 						917px;
	}

	body.internal.large #mainLeftInternal {
		padding-left: 				0;
	}

	.RightHandNav {
		position: 					relative;
		float: 						left;
		max-width: 					200px;
		width: 						100%;
		top: 						100px;
		margin: 					0 0 0 40px;
		min-height: 				1400px;
	}

	.fixedArea {
		z-index: 					999;
	}

	.footer {
		width: 						100%;
		max-width: 					974px;
		margin: 					auto;
	}
	
	.footer	p {
		font-size: 					12px;
		max-width: 					725px;
		float: 						left;
	}

	.footer a:link, .footer a:visited {
		color: 						#e41e26;
		font-size: 					12px;
	}

	.footer .socialLinks {
		float: 						right;
		width: 						220px;
		text-align: 				right;
	}

			.footer .socialLinks a {
				margin-left: 				12px;
			}	

	body.internal #footerMiddle div#footer_middle {
		width: 						100%;
		max-width: 					848px;
	}

	span.leading_separator {
		display: 					none;
	}
	

/* Article styling
=================================== */

	div.article_column:last-child , div.leading:last-child {
		border: 					0;
	}
	
	div.article_column p.iteminfo, p.iteminfo, p.articleinfo {
		margin: 					0;
		color: 						#838383;
		margin: 					0 0 30px 0;
		float: 						none;
	}
	
	div.blog p img {
		max-width: 					297px;
		float: 						right;
		margin: 					15px 0 30px 40px;
		padding: 					0;
		height: 					auto !important;
	}
	
	div#page p img {
	 	max-width: 					722px;
	    width: 						auto;
	    float: 						none; 
	    padding:					0; 
	}

	.article_separator, .row_separator {
		display: 					none;
	}
	
	.createdby, .createdate {
		display: 					block;
		color: 						#a4a4a4;
	}
	
	.none{
		display: 					none;
	}
	
	.comments {
		margin: 					0 0 20px 0;
		display: 					block;
		font-size: 					16px;
	}

	.breadcrumbs {
		padding: 					20px 0 40px 0;
	}


/* Right Hand Nav
=================================== */

	.articlelist_title a {
		margin: 					0 0 10px 0;
	}
	
	.articlelist li {
	    width:                      100%;
	    margin-right:               0;
	    text-align: 				left;
	    display:                   	block;
	    padding:                    0;
	    vertical-align:             top;
	  }
	
	ul.blogView, .articlelist {
		margin: 					0 0 60px 0;
		list-style: 				none;
	}
	
	li.blogView {
		padding: 					0;
		margin: 					0;
		font-size: 					14px;
	}
	
	li.blogView a, .articlelist_title a:link, .articlelist_title a:visited {
		text-decoration: 			none;
		padding: 					6px 0;
		display: 					block;
		font-weight: 				normal;
		font-size: 					14px;
		color: 						#1a1a1a;
		-moz-box-sizing:			border-box;
		box-sizing:					border-box;
		line-height: 				20px;
		text-align: 				left;
	}

			li.blogView a:hover, .articlelist_title a:hover {
				padding: 					6px 0 6px 10px;	
				border-left: 				4px solid #F5A52A;
				color: 						#F5A52A;
			}

	.articlelist_item {
		margin: 					0;
		float: 						none;
	}	
	
	.RightHandNav h3 {
		font-size: 					20px;
		padding: 					0 0 15px 0;
		margin: 					0;
		border-bottom: 				3px solid #e41e26;
	}


/* Misc
=================================== */
	
	h1.componentheading,
	/*
	div#page p.buttonheading,
	*/
	div.blog p.buttonheading {
		display: 					none;
	}
	
	div#page p.blogBreakOut {
		font-size: 					20px;
	    line-height: 				30px;
	}
	
	div#page ul {
		margin-bottom: 				30px;
	}
	
	div.blog_more {
		padding-top: 				60px;
	}
	
	.share-links {
	 	margin-top: 				0;
    	padding:                    40px 20px 40px 20px;
	}

/* Pagination
=================================== */

div.blog ul.pagination {
  list-style-type: none;
  text-align: left;
  display: inline;
  position: relative;
  float: left;
  margin: 0;
  padding: 13px 0;
  width: 100%;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

    div.blog ul.pagination li, div.blog ul.pagination li a:hover {
      display: inline-block;
      min-width: 20px;
      height: 20px;
      padding: 0;
      margin: 0px 3px;
      line-height: 20px;
      text-align: center;
      color: #fff;
      background-color: #f5a52a;
      border-radius: 3px;
      font-weight: bold;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      text-indent: 0;
    }

    div.blog ul.pagination li:before {
      content: none;
    }

    div.blog ul.pagination li a:hover {
      padding: 0 5px;
      margin: 0;
      background-color: #f5a52a;
    }

    div.blog ul.pagination li a, div.blog ul.pagination li:first-child, div.blog ul.pagination li:last-child, div.blog ul.pagination li:nth-child(2), div.blog ul.pagination li:nth-last-child(2) {
      display: block;
      width: 100%;
      height: 100%;
      padding: 0 5px;
      color: #5b5b5b;
      background-color: #fff;
      font-weight: normal;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      text-decoration: none;
    }

    div.blog ul.pagination li:first-child, div.blog ul.pagination li:last-child, div.blog ul.pagination li:nth-child(2), div.blog ul.pagination li:nth-last-child(2) {
      background-color: none;
      display: inline-block;
      max-width: 51px;
      text-align: center;
      padding: 0;
      color: #ccc;
      margin: 0;
    }



/* Footer
==================================== */

	.footer ul {
		text-align: 				right;
		float: 						right;
	}
	
	.footer ul li {
		list-style: 				none;
		display: 					inline-block;
		padding: 					0;
		margin-left: 				10px;	
	}	
	
	#footerMiddle {
		position: 					relative;
		float: 						left;
		padding: 					0;
	}
	
	#breadcrumbs {
		width: 						100%;
	}
	
	.buttonheading {
		float: 						none;
	}
	
	.buttonheading img {
		width: 						inherit;
	}
	
	div#page p.buttonheading {
		top: 						40px;
		left: 						0;
	}

	#mainContainer div#page p.buttonheading,
	p.buttonheading {
		right: 						0;
	}
	
	div#page p.buttonheading img, p.buttonheading img {
		display: 					none;
		width: 						inherit;
		padding: 					0;
		margin: 					10px 0 0 -23px;
		position: 					absolute;
	}


/* Break points
====================================== */  

@media all and (max-width: 1065px){

	h1.componentheading {
      padding:                    	54px 0px 206px;
    }
}


@media all and (max-width: 875px){

	.blog .right-hand-menu h3 {
		padding: 					0 0 10px 0;
	}

	.blog .right-hand-menu h3:before, .blog-internal .right-hand-menu h3:before {
		content: 					none;
	}

	div.blog p img, div#page p img {
		float: 						none;
		margin: 					auto;
		padding: 					0;
	}
	
}


@media all and (max-width: 765px){

	div.right-hand-menu {
		margin: 					40px 0 0 0;
	}

	section.content {
		margin-top: 				0;
	}

	.blog .breadcrumbs {
     	top:                        85px;
	}

	div#page p.buttonheading {
		top: 						38px;
	}

	div.blog, section.content.blog div#page,
	section.content.blog-internal div#page, .right-hand-menu {
		width: 						100%;
     	max-width: 					100%;
    	margin: 					0;
	}
}


@media all and (max-width: 640px){

	ul#shareThisList {
		margin-top: 				-20px;
		height: 					34px;
	}

	section.content {
		padding: 					0 20px 35px 20px;
	}

	.breadcrumbs {
		padding: 					20px 0 40px 0;
	}

}


@media all and (max-width: 420px) {

	div.blog p img, div#page p img {
		max-width: 					100%;
		width: 						100%;
	}

	div.article_column, div.leading {
		padding: 					40px 0 10px 0;
	}

	li.blogView a, .articlelist_title a:link, .articlelist_title a:visited {
		color: 						#007fd4;
		text-decoration: 			underline;
	}

			li.blogView a:hover, .articlelist_title a:hover {
				border-left:				0;
				padding: 					6px 0;
			}

}