/*
	Articles > Single Article
*/
/*
	Base
*/
/*
	Variables
*/
/*
	Mixins
*/
/*
	Reset
*/
h1, h2, h3, h4, h5, h6 {
  margin: 0 0; }

/*
  Global
*/
body {
  font-size: 16px; }

.fluidrow {
  margin-left: -15px;
  margin-right: -15px; }

/* ========== Structure ========== */
.article #header {
  border-bottom: 1px solid #ebf0f3; }

.article #wrapper {
  padding-top: 100px; }

/* ========== Global Elements ========== */
.article-content h1 {
  font-size: 36px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 20px; }

.article-content p.intro,
.article-content p.bigger {
  font-size: 22px;
  line-height: 1.5; }

.article-content p.quote {
  text-align: center;
  margin: 0 auto;
  font-style: italic;
  color: #918f8f; }

.article-content h2 {
  font-size: 22px;
  font-weight: bold;
  margin-top: 40px;
  margin-bottom: 20px; }

.article-content p, .article-content ul, .article-content ol {
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 20px; }

.article-content ul, .article-content ol {
  padding-right: 35px; }

.article-content li {
  margin-bottom: 15px; }

.article-content img {
  margin-top: 40px;
  margin-bottom: 40px; }

.article-content hr {
  border: 1px;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  margin-top: 40px;
  margin-bottom: 40px; }

.article-content .article-navigation h5 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 15px; }

.article-content .article-navigation ul {
  padding-right: 35px; }

.article-content .article-navigation ul li {
  font-size: 16px;
  margin-bottom: 5px; }

/* ========== Items List ========== */
.article-content .items-list .item {
  border-radius: 3px;
  background-color: #31687d;
  color: white;
  padding: 18px 20px 20px 20px;
  margin-bottom: 10px; }

.article-content .items-list .item:nth-child(2n) {
  background-color: #215468; }

.article-content .items-list .item h3 {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 10px; }

.article-content .items-list .item p {
  font-size: 16px; }

.article-content .items-list .item p:last-child {
  margin-bottom: 0; }

.article-content .item .item-content {
  margin-right: 70px; }

.article-content .item .icon {
  width: 48px;
  height: 48px;
  float: right;
  background-repeat: no-repeat; }

.article-content .item .icon.icon-liquid {
  background-image: url("../../img/articles/maintenance-treatment/ic-liquid.svg"); }

.article-content .item .icon.icon-filter {
  background-image: url("../../img/articles/maintenance-treatment/ic-filter.svg"); }

.article-content .item .icon.icon-fire {
  background-image: url("../../img/articles/maintenance-treatment/ic-fire.svg"); }

.article-content .item .icon.icon-brakes {
  background-image: url("../../img/articles/maintenance-treatment/ic-brakes.svg"); }

/* ========== Price Ranges ========== */
.article-content .price-ranges {
  margin-bottom: 45px; }

.article-content .price-ranges .price-block {
  border-radius: 3px;
  background-color: #f5f8fa;
  padding: 40px 40px 40px 40px;
  background-repeat: no-repeat;
  background-position: 40px center; }

.article-content .price-ranges .price-block.icon-gear-1 {
  background-image: url("../../img/articles/maintenance-treatment/gear-1.svg"); }

.article-content .price-ranges .price-block.icon-gear-2 {
  background-image: url("../../img/articles/maintenance-treatment/gear-2.svg"); }

.article-content .price-ranges .price-block.icon-gear-3 {
  background-image: url("../../img/articles/maintenance-treatment/gear-3.svg"); }

.article-content .price-ranges h3 {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 5px; }

.article-content .price-ranges span {
  font-size: 18px; }

/* ========== Pricing Examples Tables ========== */
.article-content .pricing-examples {
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2); }

.article-content .pricing-examples table {
  margin-bottom: 40px; }

.article-content .pricing-examples .table > tbody > tr > td {
  vertical-align: middle;
  border-top: 0; }

.article-content .pricing-examples td.models-group {
  background-color: #31687d;
  color: white;
  font-size: 18px;
  line-height: 1.5;
  text-align: center;
  border: 1px solid white; }

.article-content .pricing-examples .table > tbody > tr {
  border: 1px solid white; }

.article-content .pricing-examples .table > tbody > tr:nth-of-type(even) {
  background-color: #f5f8fa; }

.article-content .pricing-examples .table > tbody > tr:nth-of-type(odd) {
  background-color: #ebf0f3; }

.article-content .pricing-examples td.has-price {
  padding-top: 20px;
  padding-bottom: 20px; }

.article-content .pricing-examples td span {
  display: block;
  font-weight: bold;
  margin-top: 2px; }

.article-content .pricing-examples .footnote {
  float: left; }

/* ========== CTA ========== */
.article .cta-arrow {
  position: absolute;
  right: 20%;
  margin-top: -10px; }

.article .cta {
  background-color: #f7f9f9;
  padding-top: 40px;
  padding-bottom: 115px;
  margin-top: 50px; }

.article .cta h4 {
  font-size: 22px;
  font-weight: bold; }

.article .cta h5 {
  font-size: 22px;
  line-height: 1.5;
  margin-bottom: 40px; }

/*Anchor target conflicts w/ fixed navbar hotfix*/
h2:target {
  padding-top: 75px; }

@media (min-width: 768px) {
  /*Anchor target conflicts w/ fixed navbar hotfix*/
  h2:target {
    padding-top: 55px; } }
@media (min-width: 992px) {
  /* ========== Global Elements ========== */
  .article-content ul, .article-content ol {
    padding-right: 115px; }

  /* ========== CTA ========== */
  .article .cta-arrow {
    margin-top: 20px; } }
