@bw: 3px;  // border width
@gray: rgba(146,146,146,1.00);

body {
	margin-left: auto;
	margin-right: auto;
	width: 92%;
	max-width: 960px;
	padding-left: 2.275%;
	padding-right: 2.275%;
}
p.sectionContentSubTitle {
	display: flex;
	flex-flow: row;
	justify-content: space-evenly;
}
.sectionContentSubTitle span {
	flex-basis: -moz-min-content;
	flex-basis: -webkit-min-content;
	flex-basis: min-content;
}
.sectionContentSubTitle span:nth-child(2) {
	flex-basis: -moz-max-content;
	flex-basis: -webkit-max-content;
	flex-basis: max-content;
	max-width: 20vw;
	font-size: 1.0em;
}
/* Header */
header {
	text-align: center;
	display: block;
}
header .profileLogo .logoPlaceholder {
	background-color: @tableColour;
	width: 187px;
	text-align: center;
}
header .logoPlaceholder span {
	width: 80px;
	height: 22px;
	font-family: 'Montserrat', sans-serif;
	color: rgba(255,255,255,1.00);
	font-size: 30px;
	font-weight: 700;
	line-height: 53px;
}
header .profilePhoto img {
	background-color: rgba(237,237,237,1.00);
	width: 259px;
	border-radius: 50%;
	height: 259px;
	clear: both;
}
header .profileHeader h1 {
	font-family: 'Montserrat', sans-serif;
	color: @gray;
	font-size: 30px;
	font-weight: 700;
	line-height: 24px;
}
header .profileHeader h3 {
	font-family: sans-serif;
	color: @gray;
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
}
hr {
	background-color: rgba(208,207,207,1.00);
	height: 1px;
}
header .profileHeader p, .social-icons {
	font-family: sans-serif;
	color: @gray;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.8;
	overflow-y: auto;
}
header .socialNetworkNavBar {
	text-align: center;
	display: block;
	margin-top: 60px;
	clear: both;
}
header .socialNetworkNavBar .socialNetworkNav {
	display: inline-flex;
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	-o-flex-flow: row wrap;
	flex-flow: row wrap;
	align-items: stretch;
	cursor: pointer;
	justify-content: space-evenly;
	
}
.socialNetworkNav a::before {
	vertical-align: middle;
	text-align: center;
	top: 24.159%;
	position: relative;
	color: @gray;
}
header .socialNetworkNavBar .socialNetworkNav a {
	border-radius: 50%;	
	text-decoration: none;
	width: 100%;
	width: -moz-available;          /* For Mozilla */
	width: -webkit-fill-available;  /* For Chrome. */
	width: fill-available;
}
header .socialNetworkNavBar .socialNetworkNav img:hover {
	opacity: 0.5;
}
/* Main Content sections */
.mainContent .section1 {
	display: block;
}
.section1 .sectionTitle, .section2 .sectionTitle {
	font-family: 'Montserrat', sans-serif;
	color: @gray;
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
}
.section1 .sectionTitleRule, .section2 .sectionTitleRule {
	margin: 0 3% 0 0;
	float: left;
	clear: both;
}
.section1 .sectionTitleRule2, .section2 .sectionTitleRule2 {
	background-color: rgba(208,207,207,1.00);
	height: 1px;
	padding: 0px;
}
.mainContent .section1 .section1Content {
	font-family: ProximaNova;
	font-size: 14px;
	font-weight: 100;
	color: rgba(208,207,207,1.00);
}
.mainContent .section1 .section1Content span {
	color: @gray;
	font-family: sans-serif;
}
.section2 .sectionContentTitle {
	font-family: sans-serif;
	color: @gray;
	font-size: 18px;
	font-weight: 700;
	min-width: 12px;
}
.section2 .sectionContentSubTitle {
	font-family: sans-serif;
	color: rgba(68,67,67,1.00);
	font-size: 14px;
	font-weight: 400;
}
.section2 .sectionContent {
	font-family: sans-serif;
	color: @gray;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.8;
}
.mainContent {
	display: block;
}
.mainContent .externalResourcesNav .externalResources {
	background-color: rgba(208,207,207,1.00);
	display: inline-block;
	text-align: center;
	margin-top: 0px;
	padding-top: 3%;
	cursor: pointer;
}
.mainContent .externalResourcesNav .externalResources:hover {
	background-color: rgba(153,153,153,1.00);
}
.externalResourcesNav  a .externalResources {
	font-family: 'Montserrat', sans-serif;
	color: rgba(255,255,255,1.00);
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	text-decoration: none;
}
.stretch {
	content: '';
	display: inline-block;
	margin-left: 2%;
	margin-right: 2%;
}
/* Footer */
footer .footerDisclaimer {
	font-family: sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: rgba(104,103,103,1.00);
	font-weight: 700;
}
footer .footerDisclaimer span {
	color: rgba(181,178,178,1.00);
	font-weight: 400;
}
footer .footerNote {
	font-family: sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: rgba(104,103,103,1.00);
	font-weight: 700;
}
footer .footerNote span {
	color: rgba(181,178,178,1.00);
	font-weight: 400;
}
footer .social-icons {
    -webkit-font-smoothing: antialiased;
}
footer .social-icons a {
    text-decoration: none;
    color: #322f30;
}
footer ul.social-icons > li > a:hover{
    color: #d9d9d9;
    text-decoration:  underline;
}
footer .social-icons h1,h2,h3,h4,h5,h6 {
    margin:  1% 0 1% 0;
}
._12 {
    font-size: 1.2em;
}
._14 {
    font-size: 1.4em;
}

.social-icons {
    max-width: 255px;
    display:block;
    margin: 0 auto;
    color: #322f30;
}
ul.social-icons {
    margin-top: 10px;
}
.social-icons li {
    vertical-align: top;
    display: inline;
    height: 100px;
}
.social-icons a {
    color: #322f30;
    text-decoration: none;
}
.fa-facebook {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-facebook:hover {
    background-color: #3d5b99;
}
.fa-goodreads-g {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-goodreads-g:hover {
	border-color: #553B08;
	box-shadow: 0 0 10px #553B08;
    background-color: #F4F1EA;
}
.fa-linkedin-in {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-linkedin-in:hover {
    background-color: #0077b5;
}
.fa-twitter {
    padding:10px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-twitter:hover {
    background-color: #00aced;
}
.fa-rss {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-rss:hover {
    background-color: #eb8231;
}
.fa-youtube {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-youtube:hover {
    background-color: #e64a41;
}
.fa-linkedin {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-linkedin:hover {
    background-color: #0073a4;
}
.fa-google-plus {
    padding:10px 9px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #fff;
}
.fa-google-plus:hover {
    background-color: #e25714;
}
/* Social Networks */
.socialNetworkNav a {
	text-align: center;
	text-decoration: none;
}
.socialNetworkNav span {
	padding: 2.63vmax;
    display: inline;
    margin: 0 auto;
    height: 100%;
    width: auto;
	border-radius: 50%;
	behavior: url(../AboutPageAssets/styles/PIE.htc);
	font-weight: 900;
}
/* Media query for Mobile devices*/
@media only screen and (min-width : 285px) and (max-width : 480px) {
/* Header */
header {
	width: 100%;
	float: none;
}
header .profileLogo .logoPlaceholder {
	display: inline-block;
}
header .profilePhoto {
	display: inline-block;
}
header .profileHeader {
	text-align: center;
	margin-top: 10%;
}
header .profileHeader p {
	text-align: justify;
}
header .socialNetworkNavBar {
	text-align: center;
	display: block;
	margin-top: 60px;
	clear: both;
	margin-bottom: 15%;
}
header .socialNetworkNavBar .socialNetworkNav {
	width: 60px;
	height: 60px;
	margin-right: 23px;
}
/* Main content sections */
.mainContent .section1 {
	text-align: center;
	margin-bottom: 10%;
}
.section1 .section1Title, .section2 .section1Title {
	text-align: center;
}
.section1 .sectionTitleRule, .section2 .sectionTitleRule {
	width: 100%;
}
.section1 .sectionTitleRule2, .section2 .sectionTitleRule2 {
	display: none;
}
.section1 .sectionContentTitle, .section2 .sectionContentTitle {		
	font-size: 6.1vw;
}
.sectionContentSubTitle span:nth-child(2) {
	flex-basis: -moz-max-content;
	flex-basis: -webkit-max-content;
	flex-basis: max-content;
	max-width: 20vw;
	font-size: 5vw;
}
.mainContent .section1 .section1Content {
	display: inline-block;
	font-family: sans-serif;
	text-align: justify;
}
.mainContent .section2 {
	display: block;
	text-align: center;
}
.section2 .section2Content {
	margin-top: 10%;
	text-align: justify;
	margin-bottom: 10%;
}
.mainContent .externalResourcesNav {
	margin-bottom: 10%;
}
.mainContent .externalResourcesNav .externalResources {
	width: 100%;
	height: 35px;
}
/* Footer */
	
.social-icons {
    width: 255px;
}
footer {
	display: block;
	text-align: center;
	font-family: sans-serif;
}
}

/* Media Query for Tablets */
@media only screen and (min-width : 481px) and (max-width : 1024px) {
/* Header */
header {
	width: 100%;
	float: none;
}
header .profileLogo .logoPlaceholder {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
}
header .profilePhoto {
	float: left;
	clear: both;
	margin-right: 3%;
	margin-top: 5%;
}
header .profileHeader {
	text-align: left;
	margin-top: 7%;
}
header .socialNetworkNavBar .socialNetworkNav {
	margin-right: 23px;
} 
/* Main content and sections */
.section1 .section1Title, .section2 .section1Title {
	text-align: center;
}
.section1 .sectionTitleRule, .section2 .sectionTitleRule {
	width: 100%;
}
.section1 .sectionTitleRule2, .section2 .sectionTitleRule2 {
	display: none;
}
.mainContent .section1 .section1Content {
	display: block;
	margin: 0% 0% 0% 20%;
	font-family: sans-serif;
	margin-top: 5%;
	margin-bottom: 5%;
}
.mainContent .section2 {
	clear: both;
}
.section2 .section2Content {
	padding: 0px;
	margin-left: 20%;
	font-family: sans-serif;
	margin-top: 5%;
	margin-bottom: 5%;
}
.mainContent .externalResourcesNav {
	margin-left: 20%;
	margin-top: 40px;
	margin-bottom: 40px;
	text-align: center;
	padding-top: 0px;
	clear: both;
}
.mainContent .externalResourcesNav .externalResources {
	width: 199px;
	height: 48px;
	margin-top: 5%;
}
/* Footer */
footer .footerDisclaimer {
	float: left;
	margin-left: 3%;
	font-family: sans-serif;
}
footer .footerNote {
	float: right;
	margin-right: 3%;
	font-family: sans-serif;
}
}

/* Desktops and laptops  */
@media only screen and (min-width:1025px) {
/* Header */
header .profileLogo .logoPlaceholder {
	float: left;
	margin-bottom: 50px;
}
header .profilePhoto {
	float: left;
	clear: both;
	margin-right: 3%;
}
header .profileHeader {
	text-align: left;
	padding-top: 10%;
}
header .socialNetworkNavBar .socialNetworkNav {
	width: 74px;
	height: 74px;
	margin-right: 23px;
}
/* Main content sections */
.section1 .sectionTitleRule, .section2 .sectionTitleRule {
	width: 22.5%;
}
.mainContent .section1 .section1Content {
	display: block;
	margin-top: 0%;
	margin-right: 0%;
	margin-left: 26%;
	margin-bottom: 0%;
	font-family: sans-serif;
}
.mainContent .section2 {
	clear: both;
}
.section2 .section2Content {
	padding: 0px;
	margin-left: 26%;
	font-family: sans-serif;
}
.mainContent .externalResourcesNav {
	margin-top: 40px;
	margin-bottom: 40px;
	text-align: center;
	padding-top: 0px;
	clear: both;
}
.mainContent .externalResourcesNav .externalResources {
	width: 199px;
	height: 48px;
}
/* Footer */
footer .footerDisclaimer {
	float: left;
	margin-left: 3%;
	font-family: sans-serif;
}
footer .footerNote {
	float: right;
	margin-right: 3%;
	font-family: sans-serif;
}
}
/* Tables
================================== */
.Rtable {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 3em 0;
  padding: 0;
}
.Rtable-cell {
  box-sizing: border-box;
  flex-grow: 1;
  width: 100%;  // Default to full width
  padding: 0.8em 1.2em;
  overflow: hidden; // Or flex might break
  list-style: none;
  border: solid @bw white;
  background: fade(@tableColour,20%);
  > h1, > h2, > h3, > h4, > h5, > h6 { margin: 0; }
}

/* Table column sizing
================================== */
.Rtable--2cols > .Rtable-cell  { width: 50%; }
.Rtable--3cols > .Rtable-cell  { width: 33.33%; }
.Rtable--4cols > .Rtable-cell  { width: 25%; }
.Rtable--5cols > .Rtable-cell  { width: 20%; }
.Rtable--6cols > .Rtable-cell  { width: 16.6%; }


// Individual cell sizing
.Rtable-cell.Rtable-cell--1of1  { width: 100%; }
.Rtable-cell.Rtable-cell--5of6  { width: 83.33; }
.Rtable-cell.Rtable-cell--4of5  { width: 80%; }
.Rtable-cell.Rtable-cell--3of4  { width: 75%; }
.Rtable-cell.Rtable-cell--2of3  { width: 66.66%; }
.Rtable-cell.Rtable-cell--3of5  { width: 60%; }
.Rtable-cell.Rtable-cell--1of2  { width: 50%; }
.Rtable-cell.Rtable-cell--2of4  { width: 40%; }
.Rtable-cell.Rtable-cell--1of3  { width: 33.33%; }
.Rtable-cell.Rtable-cell--1of4  { width: 25%; }
.Rtable-cell.Rtable-cell--1of5  { width: 20%; }
.Rtable-cell.Rtable-cell--1of6  { width: 16.66%; }

.Rtable-cell--rowEnd {
  @media all and (max-width: @breakpoint) { margin-bottom: 1em; }
}

.hiddenLarge {
  @media all and (min-width: @breakpoint) {
    display: none;
  }
}

/* Page styling
================================== */
h1, h2, h3, h4, h5, h6 { margin-top: 0;}
h3 { font-size: 1.2em; }
h4 { font-size: 1em; }
strong { color: darken(@tableColour,20%); }
@breakpoint: 500px;
/* Responsive
==================================== */
@media all and (max-width: @breakpoint) {
  .Rtable--collapse  {
    display: block;
    > .Rtable-cell { width: 100% !important; }
    > .Rtable-cell--foot { margin-bottom: 1em; }
  }
}

// Non-Flex modernizer fallback
.no-flexbox .Rtable {
  display: block;
  > .Rtable-cell { width: 100%; }
  > .Rtable-cell--foot { margin-bottom: 1em; }
}
@tableColour: dimgrey;

/* Apply styles
================================== */
.Rtable {
  position: relative; top: @bw; left: @bw; //compensate for border offset
}
.Rtable-cell {
  margin: -@bw 0 0 -@bw;  //border collapse offset
  .Rtable-cell--light;
}

/* Cell styles
================================== */
.Rtable-cell--dark {
  background-color: @tableColour;
  border-color: darken(@tableColour,10%);
  color: white; > h1, > h2, > h3, > h4, > h5, > h6 { color: white; }
}
.Rtable-cell--medium {
  background-color: mix(white,@tableColour,50%);
  border-color: mix(white,@tableColour,40%);
}
.Rtable-cell--light {
  background-color: white;
  border-color: mix(white,@tableColour,80%);
}
.Rtable-cell--highlight {
  background-color: lightgreen;
  border-color: darken(lightgreen,10%);
}
.Rtable-cell--alert {
  background-color: darkorange;
  border-color: darken(darkorange,10%);
  color: white; > h1, > h2, > h3, > h4, > h5, > h6 { color: white; }
}

// Inherit header and footer styles
.Rtable-cell--head { .Rtable-cell--dark; }
.Rtable-cell--foot { .Rtable-cell--medium; }
@media all and (max-width: @breakpoint) {
  .hiddenSmall {display: none; }
}

/* Accordion Styling
==================================== */
@accordionColour: RosyBrown;
@iconSize: 2em;

.Accordion {
  position: relative; top: -@bw; left: -@bw; //compensate for border offset
  width: 100%;
  margin: 0 0 0.5em 0;
  padding: 0.6em 0.6em 0.6em (@iconSize);
  border-radius: 0.5em;
  text-align: left;
  border: solid @bw mix(black,@accordionColour,15%);
  background-color: @accordionColour;
  font-weight: bold;
  color: darken(@accordionColour,20%);
  text-decoration: none;
  transition: background-color 0.1s;
  cursor: pointer;
  @media all and (min-width: @breakpoint) { display: none; }
  &:hover, &:focus {
    outline: none;
    filter: contrast(150%);
  }
  &[aria-selected="true"] {
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-width: 0;
    background: mix(white,@accordionColour,70%);
  }
  &:before {
    content: "+";
    position: absolute;
    top: 50%;
    left: 0.3em;
    margin-top: -(@iconSize/1.75);
    font-weight: normal;
    font-size: @iconSize;
    line-height: @iconSize;
    background-size: @iconSize @iconSize;
  }
  &[aria-selected="true"]:before {
    content: "-";
  }
}

.js-RtableTabs, .js-RtableAccordions {
  min-width: 240px;
}
picture#logo > img {
    max-width: 47vh;
    min-width: 17vh;
    width: 39vh;
    position: relative;
    padding: 1vh;
    margin: -7vh;
    float: left;
}