/* ======================================== */
/* Basic set-up and resets - Start ======== */
/* ======================================== */
body {
  font-family: "candara", verdana, tahoma, sans-serif;
  font-size: 0.95em;
  background-color: #D0D0D0;
  padding: 0.1em;
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
}

h1 {
  border: 0;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

/* ======================================== */
/* Basic set-up and resets - End ========== */
/* ======================================== */

/* ======================================== */
/* Start layout */
/* ======================================== */
span.responsive_type:before { content: "Default Desktop (no definition)"; }

/* Sets the basic grid for the page. */
div#main_grid {
  border-radius: 3px;
  box-shadow: 1px 1px 2px #757575;
  display: grid;
  grid-template-columns: 1fr 4fr 1fr;
  grid-template-areas:
    'header header header'
    'index_grid index_grid index_grid'
    'article_grid article_grid article_grid'
    'footer footer footer';
  background-color: #fff;
  /*border: 1px solid gold;*/
}

/* Sub-grid: Determines the layout of the first page (index page). */
main#index_grid {
  grid-area: index_grid;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-areas:
    'pagination_top pagination_top pagination_top pagination_top'
    'index_article_1 index_article_1 index_article_1 index_article_2'
    'index_latest index_article_3 index_article_4 index_article_5'
    'index_latest index_article_6 index_article_7 index_article_8'
    'index_article_9 index_article_10 index_article_11 index_article_12'
    'index_article_13 index_article_14 index_article_15 index_article_16'
    'index_article_17 index_article_18 index_article_19 index_article_20'
    'index_article_21 index_article_22 index_article_23 index_article_24'
    'index_article_25 index_article_26 index_article_27 index_article_28'
    'index_article_29 index_article_30 index_article_31 index_article_32'
    'index_article_33 index_article_34 index_article_35 index_article_36'
    'index_article_37 index_article_38 index_article_39 index_article_40'
    'index_article_41 index_article_42 index_article_43 index_article_44'
    'index_article_45 index_article_46 index_article_47 index_article_48'
    'index_article_49 index_article_50 index_article_51 index_article_52'
    'index_article_53 index_article_54 index_article_55 index_article_56'

    'pagination_bottom pagination_bottom pagination_bottom pagination_bottom';
  /*background-color: #ebf4f2;*/
  /*border: 1px solid brown;*/
}

/* Sub-grid: Determines the layout of the article pages (and other sub-pages). */
main#article_grid {
  grid-area: article_grid;
  display: grid;
  grid-template-columns: 1fr 4fr;
  grid-template-areas:
    'blank article_title'
    'article_author article_summary'
    'article_latest article_content'
    'article_previous_articles article_previous_articles';
  /*background-color: #ebf4f2;*/
  /*background-color: #EFEEF0;*/
  /*padding-right: 5em;*/
}


/* Main grid elements - start */
/*div.header  {*/
header  {
  grid-area: header;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  /*background-color: #33867B;*/
  background-color: white;
  border-bottom: 3px solid #41716C;
  /*border: 1px solid gold;*/
  padding: 1em 1em 0 1em;
}


footer  {
  grid-area: footer;
  background-color: #297165;
  color: white;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  padding: 1em;
}
/* Main grid elements - end */


/* Common elements - start */
span.responsive_linebreak:before { display: block; content: "\A"; } /* a way of adding/removing a <br> tag. */
/* Page header - start */
header div.symbol { /* The F18 symbol */
  float: left;
  display: inline-block;
  /*text-align: left;*/
  /*border: 1px solid plum;*/
  padding-top: 0.2em;
  padding-right: 1em;
  padding-bottom: 0em;
}
header div.motto { /* The motto text */
  /*float: left;*/
  display: inline-block;
  text-align: left;
  padding-left: 1em;
  /*border: 1px solid blueviolet;*/
}

header div.motto p { /* The motto text */
  font-weight: bold;
  color: #4B847B;
}

header div.social_media { /* The social media and search box */
  float: right;
  display: inline-block;
  text-align: right;
  /*border: 1px solid forestgreen;*/
  vertical-align: top;
  padding-right: 0.1em;
  margin-bottom: -40px;
}

header div.social_media a img.twitter_logo { /* The twitter image tag - The Twitter logo is larger than the others, so it has special margins*/
  /*border: 1px solid DeepSkyBlue;*/
  margin-left: -10px;
  margin-right: -10px;
}

header div.social_media a img { /* The social media images - sets the generic details and especially the spacing */
  /*border: 1px solid mediumpurple;*/
  vertical-align: middle;
  padding-left: 5px;
  padding-right: 5px;
}

header div.social_media a:last-of-type img { /* The social media images - last one - removes RHS 'border' */
  /*border: 2px dotted orange;*/
  padding-right: 0;
}

header div.social_media form { /* Search box form element */
  display: inline-block;
  /*border: 1px solid crimson;*/
  /*margin-bottom: 3em;*/
}
header div.social_media form input { /* Search box input elements */
  /*display: inline-block;*/
  /*border: 1px solid steelblue;*/
  /*padding-bottom: 2em;*/
}
header div.social_media form input[type="text"] { /* Search box input elements */
  width: 20em;
}

div.google_translate_machine {
  padding-left: 5px;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #666;
}

/*div.header div.logo { [> Forum 18 News Service <]*/
  /*float: right;*/
  /*text-align: bottom;*/
  /*text-transform: uppercase;*/
  /*border: 1px solid mediumorchid;*/
/*}*/

div.menu {
  display: inline-block;
  /*border: 1px solid DeepSkyBlue;*/
  padding: 0.7em 0 0 0;
}
div.menu ul {
  display: inline-block;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
div.menu ul li {
  float: left;
  padding: 0.5em;
  margin-right: 0.6em;
  /*border: 1px solid tomato;*/
}
div.menu ul li a {
  font-weight: bold;
  font-size: 140%;
  color: #4B847B;
  text-decoration: none;
}

div.menu ul li a.donate {
  text-transform: uppercase;
  /* Brighter green text, white background */
  /* color: #00a642; */
  /* White text, square orange background */
  color: white;
  padding: 1px 4px 1px 4px;
  background-color: #ff7c00;
}

/* Page header - end */
/* Footer - start */
footer a {
  color: white;
  text-decoration: none;
}

footer span.copyright {
  text-align: right;
  float: right;
  /*border: 1px solid tomato;*/
}
/* Footer - end */
/* Common elements - end */


/* Index grid elements - start */
main#index_grid div {
  padding: 1em;
  /*border: 1px solid #cc0;*/
}

main#index_grid div.pagination_top {
  grid-area: pagination_top;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  text-align: center;
  /*border: 1px solid black;*/
}

main#index_grid div.pagination_bottom {
  grid-area: pagination_bottom;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  text-align: center;
  /*border: 1px solid black;*/
}
main#index_grid div.pagination_top a, main#index_grid div.pagination_bottom a {
  color: #4B847B;
  text-decoration: none;
}

/*div.index_sidebar {*/
  /*grid-area: index_sidebar;*/
/*}*/

div.index_article_1 {
  grid-area: index_article_1;
  /*border: 1px solid black;*/
}

div.index_latest {
  grid-area: index_latest;
}
div.index_article_2 { grid-area: index_article_2; }
/* Row 2 */
div.index_article_3 { grid-area: index_article_3; }
div.index_article_4 { grid-area: index_article_4; }
div.index_article_5 { grid-area: index_article_5; }
/* Row 3 */
div.index_article_6 { grid-area: index_article_6; }
div.index_article_7 { grid-area: index_article_7; }
div.index_article_8 { grid-area: index_article_8; }
/* Row 4 */
div.index_article_9 { grid-area: index_article_9; }
div.index_article_10 { grid-area: index_article_10; }
div.index_article_11 { grid-area: index_article_11; }
div.index_article_12 { grid-area: index_article_12; }
/* Row 5 */
div.index_article_13 { grid-area: index_article_13; }
div.index_article_14 { grid-area: index_article_14; }
div.index_article_15 { grid-area: index_article_15; }
div.index_article_16 { grid-area: index_article_16; }
/* Row 6 */
div.index_article_17 { grid-area: index_article_17; }
div.index_article_18 { grid-area: index_article_18; }
div.index_article_19 { grid-area: index_article_19; }
div.index_article_20 { grid-area: index_article_20; }
/* Row 7 */
div.index_article_21 { grid-area: index_article_21; }
div.index_article_22 { grid-area: index_article_22; }
div.index_article_23 { grid-area: index_article_23; }
div.index_article_24 { grid-area: index_article_24; }
/* Row 8 */
div.index_article_25 { grid-area: index_article_25; }
div.index_article_26 { grid-area: index_article_26; }
div.index_article_27 { grid-area: index_article_27; }
div.index_article_28 { grid-area: index_article_28; }
/* Row 9 */
div.index_article_29 { grid-area: index_article_29; }
div.index_article_30 { grid-area: index_article_30; }
div.index_article_31 { grid-area: index_article_31; }
div.index_article_32 { grid-area: index_article_32; }
/* Row 10 */
div.index_article_33 { grid-area: index_article_33; }
div.index_article_34 { grid-area: index_article_34; }
div.index_article_35 { grid-area: index_article_35; }
div.index_article_36 { grid-area: index_article_36; }
/* Row 10 */
div.index_article_37 { grid-area: index_article_37; }
div.index_article_38 { grid-area: index_article_38; }
div.index_article_39 { grid-area: index_article_39; }
div.index_article_40 { grid-area: index_article_40; }
/* Row 11 */
div.index_article_41 { grid-area: index_article_41; }
div.index_article_42 { grid-area: index_article_42; }
div.index_article_43 { grid-area: index_article_43; }
div.index_article_44 { grid-area: index_article_44; }
/* Row 12 */
div.index_article_45 { grid-area: index_article_45; }
div.index_article_46 { grid-area: index_article_46; }
div.index_article_47 { grid-area: index_article_47; }
div.index_article_48 { grid-area: index_article_48; }
/* Row 13 */
div.index_article_49 { grid-area: index_article_49; }
div.index_article_50 { grid-area: index_article_50; }
div.index_article_51 { grid-area: index_article_51; }
div.index_article_52 { grid-area: index_article_52; }
/* Row 14 */
div.index_article_53 { grid-area: index_article_53; }
div.index_article_54 { grid-area: index_article_54; }
div.index_article_55 { grid-area: index_article_55; }
div.index_article_56 { grid-area: index_article_56; }


div.blank {
  grid-area: blank;
  display: none;
}

div.index_grid_article
{
  /*padding: 1em;*/
}

/* Index: Image */

div.index_grid_article img
{
  width: 100%;
}

div.index_article_1 img {
  padding-right: 1em;
  width: 65%;
  float: left;
}

/* Index: Date */
div.index_grid_article p.article_date
{
  margin-top: 0;
  margin-bottom: 0;
  font-size: 85%;
}

div.index_article_1 p.article_date {
  margin-top: 0;
  margin-bottom: 0;
}

/* Index: Header */
div.index_grid_article h1
{
  color: #4B847B;
  font-size: 115%;
  font-weight: bold;
}

div.index_grid_article h1 a
{
  color: #4B847B;
}

div.index_article_1 h1 {
  color: #4B847B;
  font-size: 170%;
  font-weight: bold;
}

/* Index: Author (not always present) */
div.index_grid_article p.article_author
{
  margin-top: 0.2em;
  margin-bottom: 0.5em;
  font-size: 95%;
  font-weight: bold;
}

/* Index: Summary */
div.index_grid_article p.article_summary
{
  margin-top: 0.2em;
  margin-bottom: 0.2em;
  font-size: 90%;
}

div.index_article_1 p.article_summary {
  margin-top: 0.3em;
  font-size: 115%;
}

p.article_summary a {
  text-decoration: underline;
  color: #365F5A;
}

div.index_latest h1,
div.article_latest h1
{
  color: #4B847B;
  font-size: 140%;
  font-weight: bold;
}
div.index_latest ul,
div.article_latest ul
{
  padding-left: 1em;
  list-style: none;
}
div.index_latest ul li,
div.article_latest ul li
{
  /*text-decoration: none;*/
  font-size: 130%;
}
div.index_latest ul li a,
div.article_latest ul li a
{
  color: black;
}
div.index_latest ul li a.selected,
div.article_latest ul li a.selected
{
  font-weight: bold;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* Index grid elements - end */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* Article grid elements - start */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Todo: remove this?! */
/*div.article_sidebar {*/
  /*grid-area: article_sidebar;*/
  /*border: 1px solid #cc0;*/
  /*padding: 1em 1em 0 1em;*/
  /*[>background-color: #4EB5AC;<]*/
  /*[>background-color: #A4CECA;<]*/
/*}*/

div.article_title {
  grid-area: article_title;
  /*border: 1px solid indianred;*/
  padding: 1.5em 1em 0.6em 1em;
  /*align-content: end;*/
  align-self: end;
}
div.article_title h1 {
  /*border: 1px solid springgreen;*/
  color: #4B847B;
  font-size: 170%;
  font-weight: bold;
}
div.article_title h1 a {
  color: #4B847B;
}

div.article_image {
  float: right;
  border: 1px solid rgb(34,70,79);
  /*padding: 4px;*/
  margin: 3px 0 8px 8px;
}

div.article_image > div:nth-child(1) {
  /*border: 1px 1px 0 1px solid #4A4A4A;*/
  padding: 0;
  margin: 0;
}

div.article_image > div:nth-child(1) > img {
  width: 100%;
  padding: 0;
  margin: 0;
  border: 0;
}

div.article_image > div:nth-child(2) {
  padding: 1px 3px 0 3px;
  /*border-left: 1px solid #4A4A4A;*/
  /*border-right: 1px solid #4A4A4A;*/
}


div.article_image > div:nth-child(3) {
  padding: 0 3px 0 3px;
  color: #645E86;
  font-size: 75%;
  /*border-left: 1px solid #4A4A4A;*/
  /*border-right: 1px solid #4A4A4A;*/
  /*border-bottom: 1px solid #4A4A4A;*/
}

/* The copyright marker */
div.article_image > div:nth-child(3):before {
  content: "\00a9";
  margin-right: 5px;
}

div.article_summary {
  grid-area: article_summary;
  /*border: 1px solid #0f0;*/
  padding: 0.1em 1em 0 1em;
  margin: 0 0 1em 0;
}
div.article_summary p {
  color: #283e66;
  font-size: 115%;
  font-weight: bold;
  font-style: italic;
  margin: 0;
  /*border: 1px solid burlywood;*/
}

div.article_summary a {
  text-decoration: underline;
  color: #365F5A;
}
/*#article_grid > div.article_summary > p > a*/

div.article_content {
  grid-area: article_content;
  font-size: 110%;
  padding: 1em 1em 0 1em;
  /*border: 1px solid bisque;*/
  /*margin-left: 1.5em;*/
}

div.article_content > h2 {
  font-size: 130%;
  margin: 0;
  padding: 1em 0 1em 0;
}

div.article_content a {
  text-decoration: underline;
  color: #365F5A;
}

/*div.article_content > a:link    { color: #365F5A; }*/
/*div.article_content > a:visited { color: #365F5A; }*/
/*div.article_content > a:hover   { color: #365F5A; }*/
/*div.article_content > a:active  { color: #365F5A; }*/

/*div.article_content > a:link { color: #4B847B; }*/
/*div.article_content > a:visited { color: #4B847B; }*/
/*div.article_content > a:hover { color: #4B847B; }*/
/*div.article_content > a:active { color: #4B847B }*/
/*div.article_content > a:link { color: #4B847B; }*/
/*div.article_content > a:visited { color: #41716C; }*/
/*div.article_content > a:hover { color: #4EB5AC; }*/
/*div.article_content > a:active { color: crimson }*/

div.article_author {
  grid-area: article_author;
  text-align: right;
  /*border: 1px solid chocolate;*/
  padding: 0.1em 1em 0 1em;
  font-weight: bold;
}

div.article_latest {
  grid-area: article_latest;
  /*border: 1px solid slateblue;*/
  padding: 1em 1em 0 1em;
}

div.article_latest > div.share_article {
  text-align: right;
  /*border: 1px solid slateblue;*/
}

div.article_latest > div.share_article > div {
  /*border: 1px solid chocolate;*/
}
div.article_latest > div.share_article > div.addthis_inline_share_toolbox {
  /*clear: initial !important;*/
}

div.article_previous_articles {
  /*border: 1px solid slateblue;*/
  grid-area: article_previous_articles;
  margin: 2em 0.5em 0.5em 0.5em;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-areas:
    'previous_article_1 previous_article_2 previous_article_3';
}

div.previous_article {
  border-radius: 10px;
  margin: 3px;
  padding: 8px;
  border: 1px solid #888888;
  background-color: #E2E2E2;
}

div.previous_article_1 { }
div.previous_article_2 { }
div.previous_article_3 { }

div.previous_article > img {
  width: 50%;
  float: left;
  padding: 0 8px 8px 0;
}

div.previous_article > p.article_previous_date {
  font-size: 80%;
  margin: 0 0 0 0;
}

div.previous_article > h1 {
  font-size: 115%;
  margin: 8px 0 4px 0;
}

div.previous_article > h1 > a {
  color: #4B847B;
}

div.previous_article > p.article_previous_summary{
  font-size: 90%;
  margin: 0 0 0 0;
}

/* Article grid elements - end */

/*div.menu    {*/
  /*text-align: right;*/
  /*grid-area: menu;*/
  /*background-color: #CFF4EA;*/
/*}*/


/*div.sidebar { */
  /*grid-area: sidebar;*/
  /*border: 1px solid #757575;*/
  /*padding: 2px;*/
/*}*/



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* Other elements - start        */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

blockquote.forum_18_declaration {
  color: #283e66;
  font-size: 115%;
  font-weight: bold;
  font-style: italic;
  /*border: 1px solid burlywood;*/
}

/* -- Analyses page -- start */
div.analyses_region {
  width: 280px;
  padding: 0 20px 0 0;
  text-align: center;
  float: left;
  /*border: 1px solid green;*/
}
div.analyses_region h1 {
  font-size: 125%;
  font-weight: bold;
}
div.analyses_region h1 a {
  color: #4B847B;
  text-decoration: none;
}
/* -- Analyses page -- end */

/* -- Donate page -- start */
p.donate_link {
  text-align: center;
  /* border: 1px solid green; */
}
a.donate_link {
  font-size: 150%;
  font-weight: bold;
  text-transform: uppercase;
  color: white !important;
  text-decoration: none !important;
  padding: 1px 4px 1px 4px;
  background-color: #ff7c00;
  /* border: 1px solid red; */
}
/* -- Donate page -- end */

/* Other elements - end          */


/* ---------------------------------------- */
/* Responsive design - Start -------------- */
/* ---------------------------------------- */
/* Tablet 750 - 1099 pixel width - start */
@media only screen and (max-width: 1100px) {

  /* Sets the basic grid for the page. */
  div#main_grid {
    display: grid;
    grid-template-columns: 1fr 6fr;
    grid-template-areas:
      'header header'
      'index_grid index_grid'
      'article_grid article_grid'
      'footer footer';
  }

  main#index_grid {
    grid-area: index_grid;
    display: grid;
    grid-template-columns: 2fr 2fr 2fr;
    grid-template-areas:
      'pagination_top pagination_top pagination_top'
      'index_article_1 index_article_1 index_article_1'
      'index_latest index_article_2 index_article_3'
      'index_latest index_article_4 index_article_5'
      'index_article_6 index_article_7 index_article_8'
      'index_article_9 index_article_10 index_article_11'
      'index_article_12 index_article_13 index_article_14'
      'index_article_15 index_article_16 index_article_17'
      'index_article_18 index_article_19 index_article_20'
      'index_article_21 index_article_22 index_article_23'
      'index_article_24 index_article_25 index_article_26'
      'index_article_27 index_article_28 index_article_29'
      'index_article_30 index_article_31 index_article_32'
      'index_article_33 index_article_34 index_article_35'
      'index_article_36 index_article_37 index_article_38'
      'index_article_39 index_article_40 index_article_41'
      'index_article_42 index_article_43 index_article_44'
      'index_article_45 index_article_46 index_article_47'
      'index_article_48 index_article_49 index_article_50'
      'index_article_51 index_article_52 index_article_53'
      'index_article_54 index_article_55 index_article_56'
      'pagination_bottom pagination_bottom pagination_bottom';
  }

  main#article_grid {
    grid-area: article_grid;
    display: grid;
    grid-template-columns: 1fr 5fr;
    grid-template-areas:
    'blank article_title'
    'article_author article_summary'
    'article_latest article_content'
    'article_previous_articles article_previous_articles';
  }

  span.responsive_type:before { content: "Tablet (max 1100px)"; }

  /* Main grid elements - start */
  header {
    grid-area: header;
    padding: 1em 0.5em 0 0.5em;
    /*background-color: green;*/
  }
  /* Main grid elements - end */

  /* Index grid elements - start */
  /*div.blank {*/
    /*display: block;*/
  /*}*/
  div.index_article_1 img {
    width: 50%;
  }
  div.index_article_1 h1 {
    font-size: 140%;
  }
  div.index_article_1 p.article_summary {
    font-size: 100%;
  }
  /*div.index_sidebar {*/
    /*display: none;*/
  /*}*/
  /* Index grid elements - end */

  /* Article grid elements - start */
  /* Article grid elements - end */

  /* Common elements - start */
  span.responsive_linebreak:before { display: block; content: "\A"; } /* a way of adding/removing a <br> tag. */

  /* Page header - start */
  header div.symbol { /* The F18 symbol */
    padding: 0.2em 0 0 0;
  }
  header div.motto { /* The motto text */
    padding-left: 0;
  }
  header div.motto p { /* The motto text */
    font-size: 90%;
  }
  div.menu {
    padding: 1.5em 0 0 0;
  }
  div.menu ul li {
    padding: 0.3em;
    margin-right: 0.9em;
  }
  div.menu ul li a {
    font-size: 120%;
  }
  header div.social_media {
    margin-bottom: -25px;
  }
  header div.social_media form input[type="text"] { /* Search box input elements */
    width: 11em;
  }
  /* Page header - end */
  /* Footer - start */
  /* Footer - end */
  /* Common elements - end */
}
/* Tablet - end */

/* Mobile phone under 749 pixel width - start */
@media only screen and (max-width: 749px) {
  body {
    /*padding: 0;*/
    /*margin: 4px;*/
    padding: 0;
    margin: 0;
    /*border: 1px solid orangered;*/
  }
  /* Sets the basic grid for the page. */
  div#main_grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      'header'
      'index_grid'
      'article_grid'
      'footer';
  }

  main#index_grid {
    grid-area: index_grid;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'pagination_top pagination_top'
      'index_article_1 index_article_1'
      'index_article_2 index_article_2'
      'index_latest index_latest'
      'index_article_3 index_article_3'
      'index_article_4 index_article_4'
      'index_article_5 index_article_5'
      'index_article_6 index_article_6'
      'index_article_7 index_article_7'
      'index_article_8 index_article_8'
      'index_article_9 index_article_9'
      'index_article_10 index_article_10'
      'index_article_11 index_article_11'
      'index_article_12 index_article_12'
      'index_article_13 index_article_13'
      'index_article_14 index_article_14'
      'index_article_15 index_article_15'
      'index_article_16 index_article_16'
      'index_article_17 index_article_17'
      'index_article_18 index_article_18'
      'index_article_19 index_article_19'
      'index_article_20 index_article_20'
      'index_article_21 index_article_21'
      'index_article_22 index_article_22'
      'index_article_23 index_article_23'
      'index_article_24 index_article_24'
      'index_article_25 index_article_25'
      'index_article_26 index_article_26'
      'index_article_27 index_article_27'
      'index_article_28 index_article_28'
      'index_article_29 index_article_29'
      'index_article_30 index_article_30'
      'index_article_31 index_article_31'
      'index_article_32 index_article_32'
      'index_article_33 index_article_33'
      'index_article_34 index_article_34'
      'index_article_35 index_article_35'
      'index_article_36 index_article_36'
      'index_article_37 index_article_37'
      'index_article_38 index_article_38'
      'index_article_39 index_article_39'
      'index_article_40 index_article_40'
      'index_article_41 index_article_41'
      'index_article_42 index_article_42'
      'index_article_43 index_article_43'
      'index_article_44 index_article_44'
      'index_article_45 index_article_45'
      'index_article_46 index_article_46'
      'index_article_47 index_article_47'
      'index_article_48 index_article_48'
      'index_article_49 index_article_49'
      'index_article_50 index_article_50'
      'index_article_51 index_article_51'
      'index_article_52 index_article_52'
      'index_article_53 index_article_53'
      'index_article_54 index_article_54'
      'index_article_55 index_article_55'
      'index_article_56 index_article_56'
      'pagination_bottom pagination_bottom';
  }

  /* Sub-grid: Determines the layout of the article pages (and other sub-pages). */
  main#article_grid {
    grid-area: article_grid;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      'article_title'
      'article_author'
      'article_summary'
      'article_content'
      'article_latest'
      'article_previous_articles';
    /*background-color: #ebf4f2;*/
    /*background-color: #EFEEF0;*/
    padding-right: 1em;
  }

  span.responsive_type:before { content: "Mobile (max 749px)"; }

  /* Main grid elements - start */
  header {
    grid-area: header;
    padding: 0 0 0 0;
    /*background-color: blue;*/
  }
  /* Main grid elements - end */

  /* Index grid elements - start */
  div.index_article_1 img {
    padding-right: initial;
    width: 100%;
    float: none;
  }
  /* Index grid elements - end */

  /* Article grid elements - start */

  div.article_title {
    padding: 1em 0.5em 0.5em 0.5em;
  }
  div.article_author {
    padding: 0.5em;
  }

  div.article_summary {
    grid-area: article_summary;
    padding: 0.5em;
  }

  div.article_content {
    grid-area: article_content;
    padding: 0.5em;
  }

  div.article_latest {
    grid-area: article_latest;
    padding: 0.5em;
  }

  div.article_latest > div.share_article {
    text-align: left;
  }

  div.article_previous_articles {
    grid-area: article_previous_articles;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
    'previous_article_1'
    'previous_article_2'
    'previous_article_3';
  }

  div.previous_article > img {
    width: 33%;
    padding: 0 8px 8px 0;
  }
  div.article_author {
    text-align: left;
  }

  /* Article grid elements - end */

  /* Common elements - start */
  span.responsive_linebreak:before { display: inline; content: ""; } /* a way of adding/removing a <br> tag. */
  /* Page header - start */
  header div.symbol { /* The F18 symbol */
    padding: 0.2em 0 0 0;
  }
  header div.symbol img { /* The F18 image */
    width: 88px !important;
    height: 70px !important;
  }
  header div.motto { /* The motto text */
    padding: 0 0 0 0.4em;
  }
  header div.motto p { /* The motto text */
    padding: 0;
    margin: 0.2em 0 0 0;
    font-size: 67%;
  }

  header div.social_media a img.telegram_logo { /* The telegram image tag */
    width: 18px !important;
    height: 18px !important;
    margin-right: -4px !important;
  }

  header div.social_media img.facebook_logo { /* The facebook image tag */
    width: 18px !important;
    height: 18px !important;
  }

  header div.social_media img.twitter_logo { /* The twitter image tag */
    width: 32px !important;
    height: 32px !important;
  }

  header div.social_media img.rss_logo { /* The RSS image tag */
    width: 18px !important;
    height: 18px !important;
    margin-left: -3px !important;
  }

  header div.social_media {
    margin-bottom: -5px;
  }

  div.menu {
    padding: 0.4em 0 0 0.2em;
  }
  div.menu ul li {
    padding: 0.2em;
    margin-right: 0.8em;
  }
  div.menu ul li a {
    font-size: 120%;
  }
  /* Page header - end */
  /* Footer - start */
  /* Footer - end */
  /* Common elements - end */
}
/* Mobile phone - end */


/* ---------------------------------------- */
/* Responsive design - End ---------------- */
/* ---------------------------------------- */


/* ======================================== */
/* Layout - End =========================== */
/* ======================================== */



/* ======================================== */
/* Generic - Start ======================== */
/* ======================================== */


span.discrete {
  color: #868686 !important;
}

/* ======================================== */
/* Generic - End ========================== */
/* ======================================== */