hector7

Might a moderator tag this thread as resolved ?
Thanks again for your time.

Thank you so much, it works !

I suppose I need to specify #content.container somewhere with the page id, but where and how ?

Yes you’re right !
it’s what I did

.contentclass{
min-height:450px;
}

it’s better now, thanks !

Thanks
I pasted this code into the custom CSS section.
The problem by doing this, is the page begin very far away from its tittle.
You can check here for example : https://decornaturel.fr/test/
There should not be another way to solve this ? something with the footer ?

My website : https://decornaturel.fr/
You’ll see differences between these pages :
https://decornaturel.fr/votre-compte/
https://decornaturel.fr/test/, the blank space is visible on this page

In fact when there is enough content into the page, this blank space disappears.

Hi,
Thank you !
It’s ok now.
Great job ??

Whaoo !
I just changed the 5.55 value to 12.5 and it’s just perfect !!
Thank you so much for your time for the newbie I am.
You can tag this post as “Resolved” !!

Thanks for that !
It’s almost done ; just now the container into test page is bigger than the one on home page.
If I set the padding value from 5.55 to 15, the width on page is almost the same as home page, but by doing that the distance between the title of the page and the first post is a lot increased.
I need to learn CSS !!!

Ok !
Sorry.
I pasted the code here, but same effect as pasted into the CSS file. I was not surprised a lot ??
Posts displayed into the page are not different a lot from those displayed on home page, only few things that I would like to change :
– the height of the box (it’s may be the cause of black stripe under the image, I suppose there is a white one under the text)
– the underlines of text
– the position : one with image on the left, the next image on the right, and so on
You would have an idea to fix these ?
Thanks again for your time !!!

Hi

I did the modification into CSS sheet of the child theme, but it was better without the new little piece of code you gave me in the post before.
Let me understand, because I am not very comfortable with CSS, or just code…I am just a basic user.
What do you mean by Custom CSS ? There would be somewhere a file called like this or I need to create it ? Would it be the place where the user can make modifcations of the theme using “!important” tag ? and this file would just need to be reloaded into the theme folder in case of update ? Or there is just a section into style.css file where I can make modifications with “!important” tag ?
If that’s right does exist the same for function.php ?

As you’ll see I changed some details into the CSS (I don’t know if it’s the best way to achieve this problem), but it’s not fit completely to my needs.
Do the problem not come because the test page is not using completely the same width as the home page ? Where can I change this value ?
Here is the CSS with my changes :

@charset "UTF-8";
/*
Theme Name: Tracks
Theme URI: https://www.competethemes.com/tracks/
Author: Compete Themes
Author URI: https://www.competethemes.com
Description: A bold, beautiful, and responsive theme. Tracks is perfect for personal blogs, magazines, and photography websites. It includes a logo uploader, social media icons, search bar, comment display controls, premium layouts and features, and more.  See our fully-setup live demo here: https://www.competethemes.com/tracks-live-demo/
Version: 1.43
Tags: black, gray, silver, white, dark, one-column, fluid-layout, responsive-layout, custom-menu, editor-style, featured-image-header, featured-images, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain: tracks
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

Tracks WordPress Theme, Copyright 2015 Compete Themes
Tracks is distributed under the terms of the GNU GPL
*/
/*===== Variables =====*/
/* Theme Colors */
.site-title, .toggle-navigation i {
  font-size: 1.625em;
  line-height: 1.85;
}

.wp-caption-text, .excerpt-meta, .entry-meta, .more-link, .loop-pagination, .further-reading span,
.further-reading a,
.entry-categories span,
.entry-categories a,
.entry-tags span,
.entry-tags a, .author-meta .author span, .comments-number h3, .comment-author div, .design-credit, .widget li, .menu-footer-items a, .menu-secondary-items a {
  font-size: 0.813em;
  line-height: 1.85;
}

.entry-container, .comments {
  padding: 0 5.55%;
}

.site-title, .menu-unset > ul a,
.menu-primary-items a, .excerpt-meta, .entry-meta, .excerpt-title, .entry-title, .more-link, .loop-pagination, .further-reading,
.entry-categories,
.entry-tags, .author-meta .author span, .comments-number h3, .comment-author .author-name, .site-footer h3, .design-credit, .widget-title, .widget li, .menu-footer-items a, .menu-secondary-items a {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}

/* Social Media Brand Colors */
/*===== Mixins =====*/
/* grid stuff */
/* Baseline Grid
background-image: linear-gradient(#fff 23px, #00fffc 24px, #fff 0px);
background-size: 1px 24px; /* this is a 24px baseline grid */
/* Column Grid
background-color: gray;
background-image: linear-gradient(90deg, transparent 99%, rgba(255,255,255,.5) 0%);
background-size: 11.1%; /* This is at 6-columns -> just change this # */
/*===== Basic Styles =====*/
/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  height: 100%;
  font-size: 100%;
  margin: 0;
  padding: 0;
  font-family: "raleway", sans-serif;
  line-height: 1.5;
  color: #EF7B53;
  background: #222;
  -webkit-font-smoothing: antialiased;
  word-wrap: break-word;
  -ms-word-wrap: break-word;
}

.overflow-container {
  overflow: hidden;
  position: relative;
  height: auto;
  min-height: 100%;
}

.main {
  background: #222;
  padding-bottom: 1.5em;
  margin: 0 auto;
}

.loop-container:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

p {
  margin: 1.5em 0;
}

a {
  text-decoration: none;
  color: #222;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
a:link {
  color: #222;
}
a:visited, a:hover, a:active, a:focus {
  color: black;
}

article a {
  text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "raleway", sans-serif;
  margin: 0;
  padding: 0;
  font-weight: 400;
}

h1 {
  font-size: 2.625em;
  /* 42px / 16px */
  line-height: 1.143;
}

h2 {
  font-size: 2.25em;
  /* 36px / 16px */
  line-height: 1.34;
}

h3 {
  font-size: 1.625em;
  /* 26px / 16px */
  line-height: 1.85;
}

h4 {
  font-size: 1.313em;
  /* 21px / 16px */
  line-height: 1.143;
}

h5 {
  font-size: 1.125em;
  /* 18px / 16px */
  line-height: 1.34;
}

h6 {
  font-size: 1em;
  line-height: 1.5;
}

ul,
ol {
  font-size: 1em;
  padding: 0;
  margin: 1.5em;
}
ul ul, ul ol,
ol ul,
ol ol {
  margin: 0 1.5em;
}

ul ul,
ol ol,
ul ol,
ol ul,
li li {
  font-size: 1em;
}

/* Markup styles */
pre {
  word-wrap: break-word;
  -ms-word-wrap: break-word;
  word-break: break-all;
  white-space: pre-wrap;
  padding: 0.75em;
  background: #f5f5f5;
}

code {
  padding: 0 0.375em;
  background: #f5f5f5;
}

blockquote {
  margin: 1.5em 0;
  padding: 0 1.5em;
  border-left: solid 0.75em #222;
}
blockquote cite {
  display: block;
  text-align: right;
}

hr {
  margin: 0.69em 0;
}

/* Table styles */
table {
  border-spacing: 0;
  border-collapse: collapse;
  margin: 1.5em 0;
}

td {
  padding: 0.5em 0.75em;
  border: solid 1px #4d4d4d;
  line-height: 1.5;
}

th {
  padding: 0.5em 0.75em;
  border: solid 1px #4d4d4d;
  line-height: 1.5;
}

/* Images */
.alignright,
.alignleft,
.aligncenter,
.alignnone,
.size-auto,
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
  height: auto;
  line-height: 0;
  max-width: 100%;
  max-width: calc(100% - 48px);
}
.alignright img,
.alignleft img,
.aligncenter img,
.alignnone img,
.size-auto img,
.size-full img,
.size-large img,
.size-medium img,
.size-thumbnail img {
  max-width: 100%;
}

.alignleft {
  float: left;
  margin: 0 1.5em 1.5em 0;
}

.alignright {
  float: right;
  margin: 0 0 1.5em 1.5em;
}

.aligncenter {
  text-align: center;
  margin: 1.5em auto;
  display: block;
  max-width: 100%;
}

.alignnone {
  margin: 1.5em;
}

img {
  height: auto;
  line-height: 0;
}

.singular-attachment img {
  max-width: 100%;
}

.wp-caption-text {
  margin: 0;
  color: #8c8c8c;
}

.wp-caption.aligncenter {
  max-width: none;
  margin: 0 auto;
  width: auto !important;
}

/* Form styles */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="file"]):not([type="image"]),
textarea {
  padding: 0.8em;
  width: 100%;
  max-width: 27.75em;
  min-height: 45px;
  outline: solid 1px #000;
  border: none;
  font-family: "raleway", sans-serif;
  font-size: 0.813em;
  line-height: 1.85;
  border-radius: 0;
  -webkit-appearance: none;
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
}

textarea {
  max-width: 41.625em;
  overflow: auto;
}

input[type="submit"] {
  background: #222;
  color: white;
  max-width: 22.2em !important;
  min-width: 11.1em;
  padding: 0.8em;
  min-height: 45px;
  outline: none;
  border: none;
  font-family: "raleway", sans-serif;
  font-size: 0.813em;
  line-height: 1.85;
  border-radius: 0;
  -webkit-appearance: none;
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
}
input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus {
  cursor: pointer;
  background: black;
}

input[type="search"] {
  margin-right: 1.5em;
  padding-right: 0.375em;
  /* so safari 'x' doesn't get cut off */
}

/* sticky */
.excerpt.sticky .excerpt-container {
  background: wheat;
}

/* ie image border fix */
a img {
  border: none;
}

.screen-reader-text {
  position: absolute;
  clip: rect(1px 1px 1px 1px);
  /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
  width: 1px;
}

.skip-content {
  position: absolute;
  width: 100%;
  background: #111;
  color: #aaaaaa;
  text-align: center;
  padding: 0.375em;
  top: -4.5em;
  z-index: 19;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.skip-content:active, .skip-content:focus {
  top: 0;
  color: #ffffff;
}

.blog .main,
.archive .main,
.search .main {
  width: 88.89%;
  max-width: 1280px;
}

.entry {
  max-width: 100%;
}

.infinite-loader,
?#infinite-handle {
  clear: both;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) {
  html {
    -webkit-text-size-adjust: none;
    /* none for no scaling */
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  html {
    -webkit-text-size-adjust: none;
    /* none for no scaling */
  }
}
.site-header {
  padding: 0.75em 5.55%;
  background-color: #222;
}
.site-header .container {
  margin: 0 auto;
  max-width: 1280px;
}
.site-header:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.title-info {
  float: left;
  position: relative;
  z-index: 29;
}

.site-title {
  letter-spacing: 0.06em;
  opacity: 0.6;
  -webkit-transition: opacity 0.2s ease;
          transition: opacity 0.2s ease;
}
.site-title span {
  opacity: 0;
  position: absolute;
  top: -99em;
}
.site-title a {
  color: white;
}
.site-title a:link, .site-title a:visited, .site-title a:hover, .site-title a:active, .site-title a:focus {
  color: white;
}
.site-title img {
  max-width: 5em;
  max-height: 1.5em;
}
.site-title:hover, .site-title:active, .site-title:focus {
  opacity: 1;
}

.toggle-navigation {
  position: relative;
  float: right;
  z-index: 29;
  border: none;
  background: none;
  font-size: 1em;
  margin: 0;
  padding: 0 0 0 1.5em;
  color: white;
  opacity: 0.6;
  -webkit-transition: opacity 0.2s ease;
          transition: opacity 0.2s ease;
}
.toggle-navigation:hover, .toggle-navigation:active, .toggle-navigation:focus {
  opacity: 1;
  cursor: pointer;
  outline: none;
}

.menu-primary, .menu-primary-tracks {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  position: absolute;
  top: 0;
  padding-top: 6em;
  left: 100%;
  height: 100%;
  width: 100%;
  z-index: 19;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(26px, #222), color-stop(24px, transparent), color-stop(24px, transparent));
  background-image: -webkit-linear-gradient(#222 26px, transparent 24px, transparent 24px);
  background-image: linear-gradient(#222 26px, transparent 24px, transparent 24px);
  -webkit-background-size: 1px 48px;
          background-size: 1px 48px;
  /* this is a 24px baseline grid */
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
          transition: all 0.3s ease-in-out;
}

.menu-primary-tracks {
  top: 1.5em;
  left: -100%;
  z-index: 19;
}

.site-header .site-description {
  opacity: 0;
  color: white;
}

.menu-unset > ul,
.menu-primary-items {
  list-style: none;
  opacity: 0;
}
.menu-unset > ul a,
.menu-primary-items a {
  display: block;
  color: white;
  opacity: 0.6;
  margin: 1.5em 0 0.75em 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.menu-unset > ul a:only-child,
.menu-primary-items a:only-child {
  margin: 1.5em 0;
}
.menu-unset > ul a:link, .menu-unset > ul a:visited,
.menu-primary-items a:link,
.menu-primary-items a:visited {
  color: white;
}
.menu-unset > ul a:hover, .menu-unset > ul a:active, .menu-unset > ul a:focus,
.menu-primary-items a:hover,
.menu-primary-items a:active,
.menu-primary-items a:focus {
  opacity: 1;
}
.menu-unset > ul .sub-menu,
.menu-unset > ul .children,
.menu-primary-items .sub-menu,
.menu-primary-items .children {
  list-style: none;
}
.menu-unset > ul .sub-menu li a,
.menu-unset > ul .children li a,
.menu-primary-items .sub-menu li a,
.menu-primary-items .children li a {
  margin: 0.75em 0;
  opacity: 0.4;
}
.menu-unset > ul .sub-menu li a:hover, .menu-unset > ul .sub-menu li a:active, .menu-unset > ul .sub-menu li a:focus,
.menu-unset > ul .children li a:hover,
.menu-unset > ul .children li a:active,
.menu-unset > ul .children li a:focus,
.menu-primary-items .sub-menu li a:hover,
.menu-primary-items .sub-menu li a:active,
.menu-primary-items .sub-menu li a:focus,
.menu-primary-items .children li a:hover,
.menu-primary-items .children li a:active,
.menu-primary-items .children li a:focus {
  opacity: 1;
}

.site-header.toggled .menu-unset > ul,
.site-header.toggled .menu-primary-items,
.site-header.toggled .site-description {
  -webkit-transition: opacity 0.3s 0.3s ease;
          transition: opacity 0.3s 0.3s ease;
}
.site-header.toggled .menu-unset > ul,
.site-header.toggled .menu-primary-items {
  opacity: 1;
}
.site-header.toggled .site-description {
  opacity: 0.9;
}

/* 800px */
@media all and (min-width: 50em) {
  .site-header {
    position: relative;
    z-index: 2;
    padding: 1.5em 5.55% 2.25em;
    border-top: solid 0.75em #222;
  }

  .title-info {
    margin-top: -0.75em;
  }

  .site-title img {
    max-width: 8em;
    max-height: 3em;
  }

  .toggle-navigation {
    display: none;
  }

  .menu-primary, .menu-primary-tracks {
    background: none;
    position: static;
    width: 100%;
    padding: 0;
    margin: 0;
    text-align: right;
    min-height: 37px;
  }
  .menu-primary .site-description, .menu-primary-tracks .site-description {
    position: absolute;
    left: 0;
    opacity: 0.6;
  }
  .menu-primary .site-description + div, .menu-primary-tracks .site-description + div {
    margin-bottom: 0.75em;
  }

  .ie9 .site-description {
    left: 5.55%;
  }

  .menu-primary-tracks {
    display: none;
  }

  .menu-unset > ul,
  .menu-primary-items {
    margin: 0 0 0 3em;
    opacity: 1;
    /* Tier 2 */
    /* Tier 3 */
  }
  .menu-unset > ul li,
  .menu-unset > ul a,
  .menu-primary-items li,
  .menu-primary-items a {
    display: inline-block;
  }
  .menu-unset > ul li,
  .menu-primary-items li {
    position: relative;
  }
  .menu-unset > ul > li,
  .menu-primary-items > li {
    font-size: 0.813em;
    line-height: 1.85;
  }
  .menu-unset > ul > li:after,
  .menu-primary-items > li:after {
    content: '/';
    position: absolute;
    right: -6px;
    top: 0;
    color: white;
    opacity: 0.6;
  }
  .menu-unset > ul > li:last-child:after,
  .menu-primary-items > li:last-child:after {
    display: none;
  }
  .menu-unset > ul > li:last-child a,
  .menu-primary-items > li:last-child a {
    margin-right: 0;
  }
  .menu-unset > ul a,
  .menu-primary-items a {
    opacity: 0.6;
    margin: 0 0.75em;
  }
  .menu-unset > ul a:only-child,
  .menu-primary-items a:only-child {
    margin: 0 0.75em;
  }
  .menu-unset > ul ul,
  .menu-primary-items ul {
    position: absolute;
    top: -9999px;
    opacity: 0;
    left: -70%;
    right: -70%;
    min-width: 100%;
    max-width: 220px;
    margin: 0 auto;
    background: #111;
    text-align: center;
    -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
            transition: opacity 0.3s ease, transform 0.3s ease;
    -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
            transform: scale(0.95);
  }
  .menu-unset > ul ul li,
  .menu-unset > ul ul a,
  .menu-primary-items ul li,
  .menu-primary-items ul a {
    display: block;
  }
  .menu-unset > ul ul:hover,
  .menu-primary-items ul:hover {
    top: 24px;
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .menu-unset > ul ul a,
  .menu-primary-items ul a {
    padding: 0 1.5em;
  }
  .menu-unset > ul ul li:first-child > a,
  .menu-primary-items ul li:first-child > a {
    padding-top: 0.75em;
  }
  .menu-unset > ul ul li:last-child > a,
  .menu-primary-items ul li:last-child > a {
    padding-bottom: 0.75em;
  }
  .menu-unset > ul a:hover + ul, .menu-unset > ul a:active + ul, .menu-unset > ul a:focus + ul,
  .menu-primary-items a:hover + ul,
  .menu-primary-items a:active + ul,
  .menu-primary-items a:focus + ul {
    top: 24px;
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .menu-unset > ul ul ul,
  .menu-primary-items ul ul {
    left: auto;
    right: 100%;
  }
  .menu-unset > ul ul ul:hover,
  .menu-primary-items ul ul:hover {
    top: -0.75em;
  }
  .menu-unset > ul ul a:hover + ul, .menu-unset > ul ul a:active + ul, .menu-unset > ul ul a:focus + ul,
  .menu-primary-items ul a:hover + ul,
  .menu-primary-items ul a:active + ul,
  .menu-primary-items ul a:focus + ul {
    top: -0.75em;
  }
}
.excerpt-container {
  padding: 0 5.55%;
  position: relative;
  z-index: 9;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

.excerpt {
  text-align: center;
  background: white;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  margin-bottom: 1.5em;
}

.featured-image {
  position: relative;
  height: 0;
  padding-bottom: 50%;
  background-position: 50%;
  -webkit-background-size: cover cover;
          background-size: cover;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.3s ease;
          transition: transform 0.3s ease;
}

.zoom .featured-image-link {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.zoom .featured-image-link:hover .featured-image, .zoom .featured-image-link:active .featured-image, .zoom .featured-image-link:focus .featured-image {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
  -moz-transform: scale(1.05) rotate(0.02deg);
}

.excerpt-meta, .entry-meta {
  color: #aaaaaa;
  padding-top: 1.84502em;
}
.excerpt-meta a, .entry-meta a {
  color: #aaaaaa;
}
.excerpt-meta a:link, .entry-meta a:link, .excerpt-meta a:visited, .entry-meta a:visited {
  color: #aaaaaa;
}
.excerpt-meta a:hover, .entry-meta a:hover, .excerpt-meta a:active, .entry-meta a:active, .excerpt-meta a:focus, .entry-meta a:focus {
  color: #222;
}

.excerpt-title, .entry-title {
  letter-spacing: 0.04em;
  font-size: 1.313em;
  /* 21px / 16px */
  line-height: 1.143;
}
.excerpt-title a, .entry-title a {
  color: #4d4d4d;
}
.excerpt-title a:link, .entry-title a:link, .excerpt-title a:visited, .entry-title a:visited {
  color: #4d4d4d;
}
.excerpt-title a:hover, .entry-title a:hover, .excerpt-title a:active, .entry-title a:active, .excerpt-title a:focus, .entry-title a:focus {
  color: #222;
}

.excerpt-header, .entry-header {
  position: relative;
}
.excerpt-header:after, .entry-header:after {
  content: '';
  position: absolute;
  background: #4d4d4d;
  width: 4.5em;
  height: 0.375em;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -1.5em;
}

.excerpt-content {
  padding: 1.5em 0;
}

.more-link {
  position: relative;
  text-decoration: none;
  color: #4d4d4d;
  clear: both;
}
.more-link:link, .more-link:visited {
  color: #4d4d4d;
}
.more-link:hover, .more-link:active, .more-link:focus {
  color: #222;
}
.more-link:hover:after, .more-link:active:after, .more-link:focus:after {
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1);
}
.more-link:after {
  content: '';
  position: absolute;
  width: 1.5em;
  height: 3px;
  background: #4d4d4d;
  bottom: -0.75em;
  left: 0;
  right: 0;
  margin: 0 auto;
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
  -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

.loop-pagination {
  text-align: center;
  padding: 1.5em;
  margin-bottom: -1.5em;
}
.loop-pagination a,
.loop-pagination span {
  margin: 0 0.375em;
  color: #8c8c8c;
}
.loop-pagination a:link,
.loop-pagination a:visited {
  color: #8c8c8c;
}
.loop-pagination a:hover, .loop-pagination:active, .loop-pagination:focus {
  color: #aaaaaa;
}

/* 600 */
@media all and (min-width: 37.5em) {
  .excerpt {
    background: #111;
    margin-bottom: 1.5em;
  }
  .excerpt:first-child {
    padding-top: 0;
  }

  .excerpt-container {
    background: white;
    padding: 0 6.2%;
  }

  .loop-pagination {
    padding: 0.75em 1.5em 3em;
  }

  .excerpt-title, .entry-title {
    font-size: 1.875em;
    /* 30px */
    line-height: 1.6;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  .excerpt-container {
    width: 50%;
    padding: 0 5.55%;
  }

  .excerpt {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    /* fix weird chrome wiggle glitch */
    position: relative;
    clear: both;
    padding: 0;
    margin-bottom: 1.5em;
    opacity: 0.8;
    -webkit-transition: opacity 0.2s ease;
            transition: opacity 0.2s ease;
  }
  .excerpt .featured-image {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    /* fixes FF glitch where image focuses & unfocuses */
    width: 50%;
    width: calc(50% + 2px);
    height: 100%;
    padding-bottom: 0;
    position: absolute;
    right: -1px;
  }
  .excerpt:hover {
    opacity: 1;
  }

  .excerpt.even .excerpt-container {
    float: right;
  }
  .excerpt.even .featured-image {
    right: auto;
    left: -1px;
  }
  .excerpt.even:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }

  .excerpt-meta, .entry-meta {
    padding-top: 3.69004em;
  }

  .excerpt-content {
    padding-bottom: 3em;
  }
}
.entry {
  background: #222222;
  padding-bottom: 1.5em;
}

.entry-meta {
  text-align: center;
}

.entry-header {
  text-align: center;
}

.entry-meta,
.entry-header {
  padding-left: 5.55%;
  padding-right: 5.55%;
}

.entry-content {
  margin: 3em 0;
}
.entry-content img.full-width {
  position: relative;
  max-width: none;
  width: 113%;
  left: -6.5%;
}
.entry-content iframe {
  max-width: 100%;
}
.entry-content:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.further-reading span,
.entry-categories span,
.entry-tags span {
  display: block;
}
.further-reading a,
.entry-categories a,
.entry-tags a {
  font-weight: 400;
  color: #8c8c8c;
}
.further-reading a:link, .further-reading a:visited,
.entry-categories a:link,
.entry-categories a:visited,
.entry-tags a:link,
.entry-tags a:visited {
  color: #8c8c8c;
}
.further-reading a:hover, .further-reading a:active, .further-reading a:focus,
.entry-categories a:hover,
.entry-categories a:active,
.entry-categories a:focus,
.entry-tags a:hover,
.entry-tags a:active,
.entry-tags a:focus {
  color: black;
}

.entry-categories a,
.entry-tags a {
  margin-right: 0.375em;
}

.entry-meta-bottom {
  margin-bottom: 3em;
}

.author-meta {
  background: #222;
  color: white;
  padding: 1.5em;
  margin: 3em 0 0;
}
.author-meta a {
  color: #8c8c8c;
}
.author-meta a:link, .author-meta a:visited {
  color: #8c8c8c;
}
.author-meta a:hover, .author-meta a:active, .author-meta a:focus {
  color: white;
}
.author-meta p {
  clear: both;
}
.author-meta .author img {
  float: left;
  margin: 0 0.75em 1.5em 0;
  width: 4.5em;
  height: 4.5em;
  border-radius: 50%;
}
.author-meta .author a {
  font-weight: 400;
  letter-spacing: 0.1em;
  display: block;
}
.author-meta .bio a {
  margin-right: 0.375em;
  display: inline-block;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .entry {
    width: 100%;
    margin: 0 auto;
  }

  .entry-container {
    padding: 0 5.55%;
  }

  .further-reading p {
    display: inline-block;
    width: 50%;
    vertical-align: top;
    padding-right: 3em;
  }
  .further-reading .prev {
    float: left;
  }
  .further-reading .next {
    float: right;
    text-align: right;
    padding: 0 0 0 3em;
  }
  .further-reading:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }

  .author-meta .author {
    display: inline-block;
  }
  .author-meta .author img {
    margin-bottom: 0;
  }
  .author-meta:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }

  .bio {
    float: right;
    width: 50%;
  }
  .bio p {
    margin-top: 0;
  }
}
/* 700px */
@media all and (min-width: 43.75em) {
  .entry-container {
    padding: 0 11.11%;
  }

  .entry-meta,
  .entry-header {
    padding-left: 5.55%;
    padding-right: 5.55%;
  }

  .entry-content img.full-width {
    width: 128.6%;
    left: -14.3%;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  .entry .featured-image:after {
    position: absolute;
    content: '';
    background: #222;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 0.2;
    -webkit-transition: opacity 0.2s ease;
            transition: opacity 0.2s ease;
  }
  .entry .featured-image:hover:after {
    opacity: 0;
  }

  .entry-container {
    padding: 0 16.66%;
  }

  .entry-header h1 {
    font-size: 4.25em;
    line-height: 1.06;
  }

  .entry-meta {
    font-size: 1em;
    line-height: 1.5;
    padding-top: 3em;
    letter-spacing: 0.08em;
  }

  .entry-content {
    margin-top: 4.5em;
  }
  .entry-content img.full-width {
    width: 150%;
    left: -25%;
  }
}
/* 1100px */
@media all and (min-width: 68.75em) {
  .entry-meta,
  .entry-header {
    padding-left: 11.11%;
    padding-right: 11.11%;
  }

  .entry-container {
    padding: 0 19.435%;
    position: relative;
  }

  .entry-content img.full-width {
    width: 163.6%;
    left: -31.8%;
  }

  .entry-meta-bottom.float .entry-tags,
  .entry-meta-bottom.float .entry-categories {
    position: absolute;
    width: 16.66%;
    left: 0;
    top: 4.5em;
    text-align: right;
    padding-left: 5.55%;
  }
  .entry-meta-bottom.float .entry-tags a,
  .entry-meta-bottom.float .entry-categories a {
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    display: block;
    margin-right: 0;
  }
}
/* 1200px */
@media all and (min-width: 75em) {
  .entry-container {
    padding: 0 22.22%;
  }

  .entry-content img.full-width {
    width: 179.9%;
    left: -39.95%;
  }
}
.comments {
  background: white;
  padding-bottom: 3em;
  max-width: 1280px;
}

.comments-number {
  padding: 1.5em 0;
}

.comment-list {
  list-style: none;
  margin: 0;
}
.comment-list ul {
  list-style: none;
  margin: 3em 0 1.5em 3em;
}
.comment-list article ul {
  list-style: disc;
}

li.comment,
li.pingback {
  margin: 3em 0;
}
li.comment:first-child,
li.pingback:first-child {
  margin-top: 1.5em;
}

.comment-author {
  /* contains everything but the avatar */
}
.comment-author img {
  width: 4.5em;
  height: 4.5em;
  border-radius: 50%;
  float: left;
  margin: 0 0.75em 0 0;
}
.comment-author .author-name a {
  text-decoration: none;
  color: #4d4d4d;
}
.comment-author .author-name a:link, .comment-author .author-name a:visited {
  color: #4d4d4d;
}
.comment-author .author-name a:hover, .comment-author .author-name a:active, .comment-author .author-name a:focus {
  color: #222;
}
.comment-author:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.comment-reply-link,
.comment-edit-link {
  color: #4d4d4d;
  text-decoration: none;
}
.comment-reply-link:link, .comment-reply-link:visited,
.comment-edit-link:link,
.comment-edit-link:visited {
  color: #4d4d4d;
}
.comment-reply-link:hover, .comment-reply-link:active, .comment-reply-link:focus,
.comment-edit-link:hover,
.comment-edit-link:active,
.comment-edit-link:focus {
  color: black;
}

.comment-edit-link:before {
  content: " / ";
}

.comment-content {
  margin: 1.5em 0;
}

.bypostauthor .author-name:after {
  content: ' (author)';
  text-transform: none;
  font-weight: 400;
  letter-spacing: 0;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .comments {
    padding: 0 5.55% 3em;
    width: 88.88%;
    margin: 0 auto;
  }

  .comment-pagination p {
    width: 50%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
  }
  .comment-pagination .next-comment {
    text-align: right;
  }
}
/* 700px */
@media all and (min-width: 43.75em) {
  .comments {
    padding: 0 11.11% 3em;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  .comments {
    padding: 0 16.66% 3em;
  }
}
/* 1000px */
@media all and (min-width: 62.5em) {
  li.comment article,
  li.pingback article {
    line-height: 0;
    /* this is messing up the vertical rhythm */
  }
  li.comment article:after,
  li.pingback article:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }

  .comment-author {
    display: inline-block;
    min-height: 4.5em;
  }
  .comment-author img {
    float: none;
  }
  .comment-author div {
    display: inline-block;
    vertical-align: top;
  }
  .comment-author div div {
    display: block;
  }

  .comment-content {
    float: right;
    width: 50%;
    margin: 0;
    line-height: 1.5;
    /* after turning it off on article */
  }
  .comment-content p {
    line-height: 1.5;
  }
  .comment-content p:first-child {
    margin-top: 0;
  }
  .comment-content p:last-child {
    margin-bottom: 0;
  }
}
/* 1100px */
@media all and (min-width: 68.75em) {
  .comments {
    padding: 0 19.435% 3em;
  }
}
/* 1445px */
@media all and (min-width: 1445px) {
  .comments {
    padding: 0 284px 3em;
  }
}
.site-footer {
  color: #222;
  text-align: center;
  padding-top: 3em;
  overflow: hidden;
  clear: both;
}
.site-footer a {
  color: #222;
}
.site-footer h3 {
  letter-spacing: 0.06em;
  opacity: 0.4;
  -webkit-transition: opacity 0.2s ease;
          transition: opacity 0.2s ease;
}
.site-footer h3:hover, .site-footer h3:active, .site-footer h3:focus {
  opacity: 0.9;
}
.site-footer p {
  margin: 0 0 1.5em;
  opacity: 0.6;
}
.site-footer .social-media-icons {
  margin: 0.75em 0 1.5em;
}
.site-footer .social-media-icons a {
  opacity: 0.4;
}

.sidebar-footer {
  background: #1A1A1A;
  margin-bottom: -48px;
  padding: 1.5em 5.55%;
}
.sidebar-footer .widget {
  margin: 3em 0;
}
.sidebar-footer .widget:first-child {
  margin-top: 1.5em;
}
.sidebar-footer .widget a:hover, .sidebar-footer .widget a:active, .sidebar-footer .widget a:focus {
  color: #ededed;
}
.sidebar-footer .widget-title {
  margin-bottom: 12px;
}

.design-credit {
  background: #EF7B53;
  color: #111;
  padding: 0.75em 0;
  margin-top: 48px;
}
.design-credit a {
  color: #8c8c8c;
}
.design-credit a:link, .design-credit a:visited {
  color: #CD202C;
}
.design-credit a:hover, .design-credit a:active, .design-credit a:focus {
  color: #FFFFFF;
}
.design-credit p {
  margin: 0;
  opacity: 0.6;
}

.return-top {
  display: none;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .return-top {
    display: block;
    position: fixed;
    bottom: -4em;
    right: 0;
    width: 5.55%;
    height: 4em;
    background: white;
    border: none;
    opacity: 0.8;
    text-align: center;
    line-height: 4em;
    outline: none;
    -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
  }
  .return-top i {
    position: relative;
    top: 0;
    -webkit-transition: top 0.3s ease;
            transition: top 0.3s ease;
  }

  .return-top.visible {
    bottom: 0;
  }
  .return-top.visible:hover, .return-top.visible:active, .return-top.visible:focus {
    opacity: 1;
    cursor: pointer;
  }
  .return-top.visible:hover i, .return-top.visible:active i, .return-top.visible:focus i {
    top: -6px;
  }

  .sidebar-footer {
    margin-bottom: -72px;
  }

  .design-credit {
    margin-top: 72px;
  }
}
/* 700px */
@media all and (min-width: 43.75em) {
  .sidebar-footer {
    margin-top: 3em;
  }
  .sidebar-footer:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }

  .sidebar-footer:not(.active-1) .widget {
    width: 47%;
    float: left;
    margin-top: 1.5em;
  }
  .sidebar-footer:not(.active-1) .widget:nth-child(odd) {
    margin-right: 3%;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  .site-footer h3 {
    font-size: 2.625em;
    line-height: 1.143;
  }
}
/* 1000px */
@media all and (min-width: 62.5em) {
  .sidebar-footer:not(.active-1):not(.active-2) .widget {
    width: 31%;
    margin-right: 0;
    margin-top: 1.5em;
  }
  .sidebar-footer:not(.active-1):not(.active-2) .widget:nth-child(3n - 2), .sidebar-footer:not(.active-1):not(.active-2) .widget:nth-child(3n - 1) {
    margin-right: 3%;
  }
  .sidebar-footer:not(.active-1):not(.active-2) .widget:nth-child(3n + 4) {
    clear: left;
  }
}
/* page */
.singular-page .entry,
.error404 .entry,
.search .entry {
  padding-top: 3em;
}

.singular-page .featured-image {
  margin-top: -3em;
  margin-bottom: 3em;
}

.error404 input,
.search input {
  margin: 0.75em 0;
}
.error404 input[type="search"],
.search input[type="search"] {
  margin-right: 0.75em;
}

.search-form-container {
  margin: 1.5em 0 3em;
}
.search-form-container .search-icon {
  display: none;
}

.archive-header {
  padding: 1.5em 0;
  text-transform: uppercase;
  color: #8c8c8c;
}
.archive-header span {
  letter-spacing: 0.08em;
}
.archive-header h2 {
  letter-spacing: 0.06em;
  font-weight: 700;
  font-size: 1em;
  line-height: 1.5;
  display: inline-block;
}
.archive-header p {
  margin: 0.75em 0;
  text-transform: capitalize;
}

.archive .main {
  padding-bottom: 0;
}

.search .search-box {
  padding: 1.5em;
  margin-bottom: 1.5em;
  background: white;
  text-align: center;
  clear: both;
}
.search .search-box .search-form-container {
  margin-bottom: 1.5em;
}
.search .search-box.bottom {
  margin-top: 1.5em;
}

/* 900px */
@media all and (min-width: 56.25em) {
  .search-form-container {
    margin: 1.5em 0 4.5em;
  }
}
.ngg-gallery-thumbnail-box { margin: 5px .5%!important; width: 32.3%!important; }
.ngg-gallery-thumbnail a { display: block; overflow: hidden; }
.ngg-gallery-thumbnail a img { border: 1px solid #8eb83b!important; width: 95%!important; padding: 2%!important; margin: 0 auto!important; }
/* Attachment styles */
.singular-attachment .further-reading a {
  font-weight: 700;
  font-size: 1em;
  line-height: 1.5;
  color: #8c8c8c;
}
.singular-attachment .further-reading a:link, .singular-attachment .further-reading a:visited {
  color: #8c8c8c;
}
.singular-attachment .further-reading a:hover, .singular-attachment .further-reading a:active, .singular-attachment .further-reading a:focus {
  color: black;
}
.singular-attachment .further-reading p {
  width: 49.5%;
}

/* Widget Area Styles */
.sidebar-after-post-content,
.sidebar-after-page-content {
  padding: 3em 0 1.5em;
  border-top: solid 1px #ededed;
  border-bottom: solid 1px #ededed;
  margin-bottom: 1.5em;
}

/* Widget Styles */
.widget-title {
  font-size: 1em;
  line-height: 1.5;
}

.widget ul {
  margin: 1.5em 0;
  list-style: none;
}
.widget li {
  font-weight: 400;
}
.widget li a {
  color: #8c8c8c;
}
.widget li a:link, .widget li a:visited {
  color: #8c8c8c;
}
.widget li a:hover, .widget li a:active, .widget li a:focus {
  color: black;
}

.widget-search .search-form-container {
  margin-bottom: 3em;
}

/* Footer menu styles */
.menu-footer-items {
  list-style: none;
  margin: 0.75em 0 1.5em;
}
.menu-footer-items a {
  color: #8c8c8c;
  opacity: 0.4;
}
.menu-footer-items a:link, .menu-footer-items a:visited {
  color: #8c8c8c;
}
.menu-footer-items a:hover, .menu-footer-items a:active, .menu-footer-items a:focus {
  color: #8c8c8c;
  opacity: 0.9;
}
.menu-footer-items ul {
  list-style: none;
}

/* 700px */
@media all and (min-width: 43.75em) {
  .menu-footer-items li,
  .menu-footer-items a {
    display: inline-block;
  }
  .menu-footer-items a {
    margin: 0 8px;
  }
}
/* top navigation styles */
.top-navigation {
  position: relative;
  left: -6%;
  width: 112%;
  min-height: 3em;
  background: #111;
  padding: 0.375em 5.55%;
  margin: -0.75em 0 0;
  line-height: 0;
}
.top-navigation ~ button {
  top: 2.25em;
}
.top-navigation .container {
  margin: 0 auto;
  max-width: 1280px;
}
.top-navigation .container:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .top-navigation {
    margin-top: -0.75em;
    left: -6.2%;
    width: 112.4%;
    z-index: 39;
  }
}
/* 800px */
@media all and (min-width: 50em) {
  .top-navigation {
    margin: -2.25em 0 1.5em 0;
  }
}
/* secondary menu styles */
.menu-secondary {
  float: left;
  z-index: 9;
}

.toggle-secondary-navigation {
  background: none;
  border: none;
  color: white;
  opacity: 0.4;
  font-size: 1.313em;
  /* 21px / 16px */
  line-height: 1.714;
  margin: 0;
  padding: 0;
  outline: none;
  -webkit-transition: -webkit-transform 0.3s ease;
          transition: transform 0.3s ease;
}
.toggle-secondary-navigation:hover {
  cursor: pointer;
}

.menu-secondary-items {
  list-style: none;
  position: absolute;
  z-index: -1;
  opacity: 0;
  width: 100%;
  left: 0;
  padding: 1.5em;
  margin: 0;
  background: #111;
  -webkit-transition: all 0.3s ease;
          transition: all 0.3s ease;
}
.menu-secondary-items a {
  color: white;
  opacity: 0.4;
  margin-right: 0.75em;
}
.menu-secondary-items a:link, .menu-secondary-items a:visited {
  color: white;
}
.menu-secondary-items a:hover, .menu-secondary-items a:active, .menu-secondary-items a:focus {
  color: white;
  opacity: 0.9;
}
.menu-secondary-items ul {
  list-style: none;
}

/* when secondary menu is open */
#main, #title-info, #toggle-navigation, #site-header, #site-footer {
  -webkit-transition: -webkit-transform 0.3s ease;
          transition: transform 0.3s ease;
}

.secondary-toggle .site-header {
  background: transparent;
}
.secondary-toggle .toggle-secondary-navigation {
  opacity: 0.9;
  -webkit-transform: rotate(315deg);
      -ms-transform: rotate(315deg);
          transform: rotate(315deg);
}
.secondary-toggle .menu-secondary-items {
  z-index: 1;
  opacity: 1;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .menu-secondary-items {
    position: relative;
    z-index: 1;
    opacity: 1;
    padding: 0.5em 0;
  }
  .menu-secondary-items:before {
    content: '//';
    margin-right: 16px;
    color: white;
    opacity: 0.4;
  }
  .menu-secondary-items li,
  .menu-secondary-items a {
    display: inline-block;
  }

  .toggle-secondary-navigation {
    display: none;
  }

  .menu-secondary-items {
    /* Tier 2 */
    /* Tier 3 */
  }
  .menu-secondary-items li {
    position: relative;
  }
  .menu-secondary-items ul {
    position: absolute;
    top: -9999px;
    margin: 0 auto;
    left: -70%;
    right: -70%;
    max-width: 200px;
    opacity: 0;
    background: #111;
    text-align: center;
    -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
            transform: scale(0.95);
    -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
            transition: opacity 0.3s ease, transform 0.3s ease;
  }
  .menu-secondary-items ul li,
  .menu-secondary-items ul a {
    display: block;
  }
  .menu-secondary-items ul a {
    padding: 0 1.5em;
    margin: 0.75em 0;
  }
  .menu-secondary-items ul li:first-child > a {
    padding-top: 0.75em;
  }
  .menu-secondary-items ul li:last-child > a {
    padding-bottom: 0.75em;
  }
  .menu-secondary-items ul:hover {
    top: 1.5em;
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .menu-secondary-items a:hover + ul, .menu-secondary-items a:active + ul, .menu-secondary-items a:focus + ul {
    top: 1.5em;
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
  }
  .menu-secondary-items ul ul:hover {
    left: 100%;
    right: -100%;
    top: -0.60975em;
  }
  .menu-secondary-items ul a:hover + ul, .menu-secondary-items ul a:active + ul, .menu-secondary-items ul a:focus + ul {
    left: 100%;
    right: -100%;
    top: -0.60975em;
  }
}
/* search form styles */
.site-header .search-form-container {
  position: absolute;
  right: 5.55%;
  left: 12.55%;
  top: 0;
  height: 100%;
  margin: 0;
}
.site-header .search-form-container button {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  position: relative;
  z-index: 9;
  display: block;
  left: 0;
  height: 100%;
  float: right;
  border: none;
  background: #111;
  font-size: 1em;
  padding: 0.75em;
  margin: 0 -12px 0 0;
  outline: none;
  -webkit-transition: all 0.3s ease;
          transition: all 0.3s ease;
}
.site-header .search-form-container button:hover i, .site-header .search-form-container button:active i {
  opacity: 1;
}
.site-header .search-form-container button:hover {
  cursor: pointer;
}
.site-header .search-form-container i {
  position: relative;
  z-index: 9;
  color: white;
  opacity: 0.4;
  line-height: 1.5;
  -webkit-transition: opacity 0.2s ease;
          transition: opacity 0.2s ease;
}
.site-header .search-form-container input {
  margin: 0;
  height: 100%;
  position: absolute;
}
.site-header .search-form-container .search-form {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  position: absolute;
  top: 0;
  z-index: 19;
  left: 107%;
  width: 90%;
  height: 100%;
  -webkit-transition: all 0.3s ease;
          transition: all 0.3s ease;
}
.site-header .search-form-container input.search-field {
  width: 80%;
  left: 0;
  max-width: none !important;
  outline: none !important;
}
.site-header .search-form-container input.search-submit {
  width: 30%;
  right: 0;
  max-width: none !important;
  min-width: 0 !important;
  outline: none !important;
}
.site-header .search-form-container + ul {
  margin-right: 3.75em;
}

.search-open .site-header .search-form {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
}
.search-open .site-header .search-form-container {
  left: 5.55%;
}
.search-open .site-header .search-form-container button {
  width: 24%;
}
.search-open .site-header .search-form-container i {
  opacity: 1;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .search-open .site-header .search-form-container button {
    width: auto;
  }

  .site-header .search-form-container .search-form {
    width: 20em;
  }
  .site-header .search-form-container input.search-submit {
    min-width: 120px !important;
  }
}
/* social icon styling */
.social-media-icons {
  list-style: none;
  margin: 0;
  -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.2s ease-in-out;
          transition: opacity 0.3s ease-in-out, transform 0.2s ease-in-out;
}
.social-media-icons li,
.social-media-icons a {
  display: inline-block;
}
.social-media-icons a {
  font-size: 1.313em;
  /* 21px / 16px */
  line-height: 1.714;
  margin: 0 0.375em;
  color: white;
  opacity: 0.4;
  position: relative;
  z-index: 9;
}
.social-media-icons a:link, .social-media-icons a:visited {
  color: white;
}
.social-media-icons a:hover, .social-media-icons a:active, .social-media-icons a:focus {
  color: white;
  opacity: 1;
}

.site-header .social-media-icons {
  float: right;
  height: 100%;
}

.search-open .site-header .social-media-icons {
  opacity: 0;
  -webkit-transform: translateX(12px);
      -ms-transform: translateX(12px);
          transform: translateX(12px);
}

@media all and (min-width: 1500px) {
  .top-navigation .social-media-icons {
    margin-right: 0px !important;
  }
}
/**
 * 14.2 Galleries
 */
.gallery {
  margin: 2.25em auto;
}

.gallery-item {
  display: inline-block;
  padding: 0.75em;
  text-align: center;
  vertical-align: top;
  width: 100%;
  margin: 0;
}
.gallery-item img {
  max-width: 100%;
  max-height: 100%;
}

.gallery-columns-2 .gallery-item {
  max-width: 50%;
}

.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
  max-width: 25%;
}

.gallery-columns-5 .gallery-item {
  max-width: 20%;
}

.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-icon img {
  margin: 0 auto;
}

.gallery-caption {
  color: #8c8c8c;
  display: block;
  font-family: "raleway", sans-serif;
  font-size: 12px;
  padding: 0.5em 0;
}

.gallery-columns-6 .gallery-caption,
.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption {
  display: none;
}

/* Jetpack Galleries */
.tiled-gallery {
  margin: 2.25em auto !important;
}
.tiled-gallery .gallery-row {
  margin: 0 auto;
}

/* Styles for when user selects a dark header */
.dark-header {
  /* Secondary Nav */
  /* Search Icon */
}
.dark-header .site-title a {
  color: #222;
}
.dark-header .site-title a:link, .dark-header .site-title a:visited, .dark-header .site-title a:hover, .dark-header .site-title a:active, .dark-header .site-title a:focus {
  color: #222;
}
.dark-header .toggle-navigation {
  color: #222;
}
.dark-header .site-header .site-description {
  color: #222;
}
.dark-header .site-header .social-media-icons a {
  color: #222;
}
.dark-header .site-header .social-media-icons a:link, .dark-header .site-header .social-media-icons a:visited {
  color: #222;
}
.dark-header .site-header .social-media-icons a:hover, .dark-header .site-header .social-media-icons a:active, .dark-header .site-header .social-media-icons a:focus {
  color: #222;
}
.dark-header .toggle-secondary-navigation {
  color: #222;
}
.dark-header .menu-secondary-items a,
.dark-header .menu-secondary-items a:link,
.dark-header .menu-secondary-items a:visited,
.dark-header .menu-secondary-items a:hover,
.dark-header .menu-secondary-items a:active,
.dark-header .menu-secondary-items a:focus {
  color: #222;
}
.dark-header .site-header .search-form-container i {
  color: #222;
}
.dark-header .site-header.toggled .site-title a {
  color: white;
}
.dark-header .site-header.toggled .site-title a:link, .dark-header .site-header.toggled .site-title a:visited, .dark-header .site-header.toggled .site-title a:hover, .dark-header .site-header.toggled .site-title a:active, .dark-header .site-header.toggled .site-title a:focus {
  color: white;
}
.dark-header .site-header.toggled .toggle-navigation {
  color: white;
}
.dark-header .site-header.toggled .site-description {
  color: white;
}

/* 600px */
@media all and (min-width: 37.5em) {
  .dark-header .menu-secondary-items:before {
    color: #222;
  }
  .dark-header .menu-secondary-items ul {
    background: white;
  }
}
/* 800px */
@media all and (min-width: 50em) {
  .dark-header .menu-unset > ul a,
  .dark-header .menu-primary-items a {
    color: #222;
  }
  .dark-header .menu-unset > ul a:link, .dark-header .menu-unset > ul a:visited,
  .dark-header .menu-primary-items a:link,
  .dark-header .menu-primary-items a:visited {
    color: #222;
  }
  .dark-header .menu-unset > ul > li:after,
  .dark-header .menu-primary-items > li:after {
    color: #222;
  }
  .dark-header .menu-unset > ul ul,
  .dark-header .menu-primary-items ul {
    background: white;
  }
}
/* background image styles */
.background-image-active .background-image {
  -webkit-background-size: cover cover;
          background-size: cover;
  background-position: 50%;
  position: fixed;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.background-image-active .site-header {
  border-color: transparent;
}
.background-image-active .excerpt {
  opacity: 1;
}
.background-image-active .site-header,
.background-image-active .site-header .search-form-container button,
.background-image-active .main,
.background-image-active .menu-secondary-items {
  background: none;
}
.background-image-active .top-navigation {
  background: rgba(255, 255, 255, 0.2);
}
.background-image-active .site-footer {
  background: #222;
}

/* background style textures */
.background-texture-active .site-header,
.background-texture-active .site-header .search-form-container button,
.background-texture-active .main,
.background-texture-active .menu-secondary-items {
  background: none;
}
.background-texture-active .site-header {
  border-color: transparent;
}
.background-texture-active .site-footer {
  background: #222;
}
.background-texture-active .top-navigation {
  background: rgba(255, 255, 255, 0.2);
}
.background-texture-active .excerpt {
  opacity: 1;
}

/* Featured Video styles */
.featured-video video {
  width: 100%;
}

.singular-page .featured-video {
  margin: -3em 0 3em;
}

.full-width-images.blog .excerpt.has-video,
.full-width-images.archive .excerpt.has-video,
.two-column-images.blog .excerpt.has-video,
.two-column-images.archive .excerpt.has-video {
  background: none;
}
.full-width-images.blog .excerpt.has-video .overlay,
.full-width-images.blog .excerpt.has-video .overlay-link,
.full-width-images.blog .excerpt.has-video i,
.full-width-images.archive .excerpt.has-video .overlay,
.full-width-images.archive .excerpt.has-video .overlay-link,
.full-width-images.archive .excerpt.has-video i,
.two-column-images.blog .excerpt.has-video .overlay,
.two-column-images.blog .excerpt.has-video .overlay-link,
.two-column-images.blog .excerpt.has-video i,
.two-column-images.archive .excerpt.has-video .overlay,
.two-column-images.archive .excerpt.has-video .overlay-link,
.two-column-images.archive .excerpt.has-video i {
  display: none;
}
.full-width-images.blog .excerpt.has-video .excerpt-container,
.full-width-images.archive .excerpt.has-video .excerpt-container,
.two-column-images.blog .excerpt.has-video .excerpt-container,
.two-column-images.archive .excerpt.has-video .excerpt-container {
  position: relative;
  opacity: 1;
}
.full-width-images.blog .excerpt.has-video .excerpt-header, .full-width-images.blog .excerpt.has-video .entry-header,
.full-width-images.archive .excerpt.has-video .excerpt-header,
.full-width-images.archive .excerpt.has-video .entry-header,
.two-column-images.blog .excerpt.has-video .excerpt-header,
.two-column-images.blog .excerpt.has-video .entry-header,
.two-column-images.archive .excerpt.has-video .excerpt-header,
.two-column-images.archive .excerpt.has-video .entry-header {
  padding: 0.75em 1.5em 1.5em;
}
.full-width-images.blog .excerpt.has-video .excerpt-title, .full-width-images.blog .excerpt.has-video .entry-title,
.full-width-images.archive .excerpt.has-video .excerpt-title,
.full-width-images.archive .excerpt.has-video .entry-title,
.two-column-images.blog .excerpt.has-video .excerpt-title,
.two-column-images.blog .excerpt.has-video .entry-title,
.two-column-images.archive .excerpt.has-video .excerpt-title,
.two-column-images.archive .excerpt.has-video .entry-title {
  font-size: 1em;
  line-height: 1.5;
}
.full-width-images.blog .excerpt.has-video .excerpt-title a, .full-width-images.blog .excerpt.has-video .entry-title a,
.full-width-images.archive .excerpt.has-video .excerpt-title a,
.full-width-images.archive .excerpt.has-video .entry-title a,
.two-column-images.blog .excerpt.has-video .excerpt-title a,
.two-column-images.blog .excerpt.has-video .entry-title a,
.two-column-images.archive .excerpt.has-video .excerpt-title a,
.two-column-images.archive .excerpt.has-video .entry-title a {
  color: white;
  opacity: 0.8;
}
.full-width-images.blog .excerpt.has-video .excerpt-title a:link, .full-width-images.blog .excerpt.has-video .entry-title a:link, .full-width-images.blog .excerpt.has-video .excerpt-title a:visited, .full-width-images.blog .excerpt.has-video .entry-title a:visited,
.full-width-images.archive .excerpt.has-video .excerpt-title a:link,
.full-width-images.archive .excerpt.has-video .entry-title a:link,
.full-width-images.archive .excerpt.has-video .excerpt-title a:visited,
.full-width-images.archive .excerpt.has-video .entry-title a:visited,
.two-column-images.blog .excerpt.has-video .excerpt-title a:link,
.two-column-images.blog .excerpt.has-video .entry-title a:link,
.two-column-images.blog .excerpt.has-video .excerpt-title a:visited,
.two-column-images.blog .excerpt.has-video .entry-title a:visited,
.two-column-images.archive .excerpt.has-video .excerpt-title a:link,
.two-column-images.archive .excerpt.has-video .entry-title a:link,
.two-column-images.archive .excerpt.has-video .excerpt-title a:visited,
.two-column-images.archive .excerpt.has-video .entry-title a:visited {
  color: white;
}
.full-width-images.blog .excerpt.has-video .excerpt-title a:hover, .full-width-images.blog .excerpt.has-video .entry-title a:hover, .full-width-images.blog .excerpt.has-video .excerpt-title a:active, .full-width-images.blog .excerpt.has-video .entry-title a:active, .full-width-images.blog .excerpt.has-video .excerpt-title a:focus, .full-width-images.blog .excerpt.has-video .entry-title a:focus,
.full-width-images.archive .excerpt.has-video .excerpt-title a:hover,
.full-width-images.archive .excerpt.has-video .entry-title a:hover,
.full-width-images.archive .excerpt.has-video .excerpt-title a:active,
.full-width-images.archive .excerpt.has-video .entry-title a:active,
.full-width-images.archive .excerpt.has-video .excerpt-title a:focus,
.full-width-images.archive .excerpt.has-video .entry-title a:focus,
.two-column-images.blog .excerpt.has-video .excerpt-title a:hover,
.two-column-images.blog .excerpt.has-video .entry-title a:hover,
.two-column-images.blog .excerpt.has-video .excerpt-title a:active,
.two-column-images.blog .excerpt.has-video .entry-title a:active,
.two-column-images.blog .excerpt.has-video .excerpt-title a:focus,
.two-column-images.blog .excerpt.has-video .entry-title a:focus,
.two-column-images.archive .excerpt.has-video .excerpt-title a:hover,
.two-column-images.archive .excerpt.has-video .entry-title a:hover,
.two-column-images.archive .excerpt.has-video .excerpt-title a:active,
.two-column-images.archive .excerpt.has-video .entry-title a:active,
.two-column-images.archive .excerpt.has-video .excerpt-title a:focus,
.two-column-images.archive .excerpt.has-video .entry-title a:focus {
  color: white;
  opacity: 1;
}

@media all and (min-width: 56.25em) {
  .excerpt .featured-video {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    /* fixes FF glitch where image focuses & unfocuses */
    width: 50%;
    height: 100%;
    padding-bottom: 0;
    position: absolute;
    right: 0;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
  }
  .excerpt .featured-video div,
  .excerpt .featured-video video {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }

  .excerpt.even .featured-video {
    right: 50%;
    right: calc(50% - 1px);
  }

  /* Premium Layouts */
  .full-width .excerpt .featured-video,
  .full-width-images .excerpt .featured-video,
  .two-column .excerpt .featured-video,
  .two-column-images .excerpt .featured-video {
    width: 100%;
    height: auto;
    position: relative;
    right: 0;
  }
  .full-width .excerpt .featured-video div,
  .full-width .excerpt .featured-video video,
  .full-width-images .excerpt .featured-video div,
  .full-width-images .excerpt .featured-video video,
  .two-column .excerpt .featured-video div,
  .two-column .excerpt .featured-video video,
  .two-column-images .excerpt .featured-video div,
  .two-column-images .excerpt .featured-video video {
    position: relative;
    top: 0;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  .ie9 .excerpt {
    opacity: 1;
  }
  .ie9 .excerpt:hover {
    opacity: 1;
  }
}
/* Styles for Disqus Comment System */
#disqus_thread {
  background: white;
  padding: 1.5em 5.55%;
  max-width: 1280px;
}

/* 600px */
@media all and (min-width: 37.5em) {
  #disqus_thread {
    width: 88.88%;
    margin: 0 auto;
  }
}
/* 700px */
@media all and (min-width: 43.75em) {
  #disqus_thread {
    padding: 1.5em 10%;
  }
}
/* 900px */
@media all and (min-width: 56.25em) {
  #disqus_thread {
    padding: 1.5em 14.66%;
  }
}
/* 1100px */
@media all and (min-width: 68.75em) {
  #disqus_thread {
    padding: 1.5em 17.435% 3em;
  }
}
/* 1200px */
@media all and (min-width: 75em) {
  #disqus_thread {
    padding: 1.5em 19.75% 3em;
  }
}
@media all and (min-width: 1400px) {
  #disqus_thread {
    padding: 1.5em 285px 3em;
  }
}
/* bbpress Styles */
.bbpress.archive .main {
  width: 100%;
  margin-bottom: 3em;
}

.entry-bbpress {
  padding-top: 3em;
}
.entry-bbpress .entry-container {
  padding: 0 11.11%;
}

#wp-bbp_topic_content-editor-container input,
#wp-bbp_reply_content-editor-container input {
  width: auto;
  padding: 6px 24px !important;
}
#wp-bbp_topic_content-editor-container textarea,
#wp-bbp_reply_content-editor-container textarea {
  outline: solid 1px #222;
  margin-top: 1.5em !important;
}

#bbp_topic_tags {
  max-width: 500px;
  font-size: 13px;
}

#bbp_topic_title {
  max-width: none;
}

.bbp-submit-wrapper button {
  background: #222;
  color: white;
  max-width: 22.2em !important;
  min-width: 11.1em;
  padding: 0.8em;
  min-height: 45px;
  outline: none;
  border: none;
  font-family: "raleway", sans-serif;
  font-size: 0.813em;
  line-height: 1.85;
  border-radius: 0;
  -webkit-appearance: none;
  -webkit-transition: all 0.2s ease;
          transition: all 0.2s ease;
}
.bbp-submit-wrapper button:hover, .bbp-submit-wrapper button:active, .bbp-submit-wrapper button:focus {
  cursor: pointer;
  background: black;
}

@media all and (min-width: 62.5em) {
  #bbp_topic_title {
    width: 70%;
  }
}
#bbpress-forums div.bbp-search-form {
  margin: 1px 0 12px 0;
}

@media all and (min-width: 43.75em) {
  #bbpress-forums #bbp-search-form #bbp_search {
    width: 500px !important;
  }
}
/*

ATTENTION:

CSS edits made here won't have any effect. Tracks doesn't load the style.css file because
it loads a minified version of the stylesheet instead (style.min.css) to make your site faster.

If you want to make CSS edits to your site, use the "Custom CSS" section in the Customizer.

If you want more information about customizing Tracks with CSS, check out this guide: https://www.competethemes.com/help/custom-css-tracks/

*/

Hi guys

Thanks again for your help.
So I’ve checked, and you were right I did a mistake between “-” and “_” in the file name…stupid isn’t it !
You can see the page and what is done now, it’s better but not exactly as expected.
https://test.decornaturel.fr/language/en/testpage/

So, I did the modification, and put the file into Tracks and Child, both.
Unfortunately the result is not as expected.
You can check the test page here : https://test.decornaturel.fr/language/en/testpage/

Thanks for all guys and see you tomorrow (best regards from France) !