/* This styles a one column 'elaboration page: elaboration_onecol.css'*/

body {
  margin: 0;
  padding: 0;
  max-width: 100%;
  font-family: 'nunito_sansregular', 'latoregular', 'arial', sans-serif;
  font-size: 100%;
  line-height: 1;
  /* Backup, in case gradient fails */
  background-color: #8470a3;

  /*For the concentric circle background */
  /* From: https://codepen.io/joshuar/pen/qNBYLK   CSS Backgrounds  joshuar.   NB: I don't think this is working as it should.  The circles should have speckles on them.  Failure due, I think, to CSS(SCSS) here; couldn't get straight css*/
  background-color: DarkRed;
  background-image: radial-gradient(circle at center center, black, #ccc), repeating-radial-gradient(circle at center center, black, black, 1rem, transparent 2rem, transparent 1rem);
  background-blend-mode: multiply;
}

/*Later: This is the SCSS compiled to CSS.  With this could get texture on the spirals, but only 'strokes' in one direction.  However, it still stopped from working the 'return to methods' a-tag ()like the SCSS code did. So finally have omitted it*/
/*
body:before {
  content: '';
  left: 0;
  position: absolute;
  width: 200%;
  height: 100%;
  background: repeating-linear-gradient(45deg, transparent, transparent 1px, rgba(0, 0, 0, 0.1) 1px, rgba(255, 255, 255, 0.05) 5px);
}
*/

/*  This CSS, compiled from the original SCSS is omitted because it causes another circle 'page' to appear below the wanted one*/
/*
body:after {
  content: '';
  position: absolute;
  width: 200%;
  height: 100%;
  right: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 1px, rgba(0, 0, 0, 0.1) 1px, rgba(255, 255, 255, 0.05) 5px);
}

*/

/* End css for body */







.elaboration_content_wrapper {
margin: 0;
padding: 0;
background-color:;
}

.title_container_onecol_elaboration {
margin:0;
padding:0;
text-align: center;
display:block;
position: relative;
/* MUST use 'top' ao margin-top.  Using margin-top stopped the index page from scrolling filly to the top, with the 'to top of page' scrolls.  Creates a gap at the very top*/
top: 25px;
}

.title_container_onecol_elaboration h1
{
margin: 0;
padding: 0;
/*Same as colour for h1 in pages 1-6*/
color: #ffefd5;
font-size: 40px;
/*Margin left and right just so the title-heading never bangs against screen edges*/
margin-left:10px;
margin-right:10px;
line-height:1;
/*So text's background, if have one, isn't full width*/
display: inline-block;
background-color:;
font-family:'source_sans_proregular';
}

.elaboration_returnlink {
padding: 0;
margin: 0;
color: darkgoldenrod;
font-size: ;
margin-left: 10px;
margin-right: 10px;
margin-top: 50px;
}

.elaboration_totoplink {
padding: 0;
margin: 0;
color: darkgoldenrod;
font-size: ;
margin-left: 10px;
padding-bottom: ;
}

.elaboration_returnlink a,
.elaboration_totoplink a {
color: goldenrod;
}
.elaboration_returnlink a:hover,
.elaboration_totoplink a:hover {
color:gold;
text-decoration: none;
}
.elaboration_returnlink a:active,
.elaboration_totoplink a:active {
color:aqua;
text-decoration: none;
}




.text_container {
margin-top: 20px;
margin-bottom: 20px;
margin-left: 22%;
margin-right: 22%;
padding:10px;
background: ;
font-size: 16px;
font-family: 'ubuntulight';
/*Same as color for dark mode text in pages 1-6*/
color:  #eee4d3;
}


/*MQ*/
@media screen and (max-width: 968px){
.text_container {
margin-left: 15%;
margin-right: 15%;
background-color:;
}
}
/*END: MQ*/


/*MQ*/
@media screen and (max-width: 868px){
.text_container  {
margin-left: 12%;
margin-right: 12%;
background-color: ;
}
}
/*END: MQ*/



/* MQ Tablet size*/
@media screen and (max-width: 768px){
.title_container_onecol_elaboration h1 {
font-size: 30px;
}

.text_container {
margin-left: 10%;
margin-right: 10%;
}
}
/* END: MQ Tablet size*/



/*MQ*/
@media screen and (max-width: 668px){
.text_container {
margin-left: 6%;
margin-right: 6%;
background-color:;
}
}
/*END: MQ*/



/*MQ*/
@media screen and (max-width: 568px){
.text_container {
margin-left: 3%;
margin-right: 3%;
background-color: ;
}
}
/*END: MQ*/



/* MQ */
@media screen and (max-width: 425px){
.title_container_onecol_elaboration h1 {
font-size: 26px;
}

.text_container {
margin-left: 0%;
margin-right: 0%;
background:;
}
}
/* END: MQ */