/* I just want to preface this by saying that I love the redesign and I don't want to come off as some
condescending backseat designer. That's not my intention.

I just like making adjustments to CSS of sites I frequent with an extension on Chrome
called Stylebot and though why not post this on the forums along with some notes. */

/* I felt like the base font size was a bit too big and I like to
use 16px */
html {
    font-size: 16px;
}

/* I found the arrows a bit too bulky and that they didn't have enough
breathing room on their left side */
.masthead-nav-item-icon {
    font-size: 1rem;
    margin-left: .25rem;
}

/* Adjusted the sizes in the next three rules a bit to fit better with the changes I
made to the base font size. I also found the border kind of out of place */
.live-pulse.small {
    width: 1rem;
    height: 1rem;
    margin: 0 .75rem 0px 0;
}

.masthead-avatar {
    border: none;
    height: 2rem;
    width: 2rem;
}

.masthead-toggle .symbol {
    font-size: 1.25rem;
}

/* I found the background color a bit too distracting. Though not sure if it sticks
out enough without it */
.carousel-strip__control button {
    background-color: inherit;
}

/* In the next three rules I adjusted pure gray scale colors to have a little blue hue
as I noticed had been done to the background color of the site. I like that, it gives
the colors a bit more life */
.bg-25 {
    background-color: #3c3f42;
}

.js-masthead-subnav {
    background: #242628;
}

.masthead-subnav-items {
    border-color: #161819;
}

/* I found the titles of the videos and in "Latest form the community" to be too big */
@media  (min-width: 1280px) {
  h5, h6, p, .text-medium {
    font-size: 16px;
  }
}

/* I found the borders kind of distracting and unnecessary */
.masthead-subnav-item {
    border: none;
}

/* Added margin with same width as arrow buttons so that the titles line up with the
first item in the carousel */
.pod--carousel-strip h2 {
    margin-left: 36px;
}