/* =============================================================================
// STYLE.CSS
// -----------------------------------------------------------------------------
// Demo styles.
// ========================================================================== */

/* =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Integrity Pages
//   02. Renew Pages
//   03. Icon Pages
//   04. Pages Mobile Styles
//   05. Buttons
//   06. Slider Buttons
//   07. Icon Examples
//   08. Shortcodes - Buy Band
//   09. Shortcodes - Demo Columns
// ========================================================================== */

/* Integrity Pages
// ========================================================================== */

/*
// All.
*/

.x-integrity [class*="container-pages"] {
  padding-top: 5%;
  padding-bottom: 5%;
}

.x-integrity [class*="container-pages"] .h-pages {
  margin-top: 0;
  margin-bottom: 25px;
  font-size: 48px;
  font-weight: 700;
  text-transform: uppercase;
  color: #000 !important;
}

.x-integrity [class*="container-pages"] .h-pages span i {
  color: #fff !important;
  background-color: #000 !important;
}

.x-integrity [class*="container-pages"] .p-pages {
  margin-bottom: 25px;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.5;
  color: #000;
}

.x-integrity [class*="container-pages"] .x-btn {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #ac1100;
  background-color: #ff2a13;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.x-integrity [class*="container-pages"] .x-btn-circle-wrap {
  margin-bottom: 0 !important;
}

.x-integrity [class*="container-pages"] .x-btn:hover {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #600900;
  background-color: #ef2201;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}


/*
// Specific.
*/

.x-integrity .container-pages-shortcodes,
.x-integrity .container-pages-features {
  text-align: center;
}

.x-integrity .container-pages-shortcodes .p-pages,
.x-integrity .container-pages-features .p-pages {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.x-integrity .container-pages-pages .p-pages {
  max-width: 60%;
}

.x-integrity .container-pages-layouts .p-pages {
  max-width: 82%;
}


/*
// Home 1.
*/

.x-integrity.home div.x-content-dock h4 {
  font-size: 32px !important;
  font-weight: 700 !important;
}

.x-integrity.home div.x-content-dock p {
  font-size: 21px !important;
  font-weight: 300 !important;
}

.x-integrity.home .custom-counter .x-counter .number-wrap .number {
  font-weight: 700 !important;
}



/* Renew Pages
// ========================================================================== */

/*
// All
*/

.x-renew [class*="container-pages"] {
  padding-top: 5%;
  padding-bottom: 5%;
}

.x-renew [class*="container-pages"] .h-pages {
  margin-top: 0;
  margin-bottom: 25px;
  font-size: 48px;
  font-weight: 700;
  text-transform: uppercase;
  color: #000 !important;
}

.x-renew [class*="container-pages"] .h-pages span i {
  color: #fff !important;
  background-color: #000 !important;
}

.x-renew [class*="container-pages"] .p-pages {
  margin-bottom: 25px;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.5;
  color: #000;
}

.x-renew [class*="container-pages"] .x-btn {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #ac1100;
  background-color: #ff2a13;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.x-renew [class*="container-pages"] .x-btn-circle-wrap {
  margin-bottom: 0 !important;
}

.x-renew [class*="container-pages"] .x-btn:hover {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #600900;
  background-color: #ef2201;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}


/*
// Specific.
*/

.x-renew .container-pages-shortcodes,
.x-renew .container-pages-features {
  text-align: center;
}

.x-renew .container-pages-shortcodes .p-pages,
.x-renew .container-pages-features .p-pages {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.x-renew .container-pages-pages .p-pages {
  max-width: 60%;
}

.x-renew .container-pages-layouts .p-pages {
  max-width: 82%;
}

.x-btn.btn-buy {
  border-color: #00a3a3;
  background-color: #00a3a3;
}

.x-btn.btn-buy:hover {
  border-color: #008484;
  background-color: #008484;
}



/* Icon Pages
// ========================================================================== */

/*
// All.
*/

.x-icon [class*="container-pages"] {
  padding-top: 5%;
  padding-bottom: 5%;
}

.x-icon [class*="container-pages"] .h-pages {
  margin-top: 0;
  margin-bottom: 25px;
  font-size: 48px;
  font-weight: 700;
  text-transform: uppercase;
  color: #000 !important;
}

.x-icon [class*="container-pages"] .h-pages span i {
  color: #fff !important;
  background-color: #000 !important;
}

.x-icon [class*="container-pages"] .p-pages {
  margin-bottom: 25px;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.5;
  color: #000;
}

.x-icon [class*="container-pages"] .x-btn {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #ac1100;
  background-color: #ff2a13;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.x-icon [class*="container-pages"] .x-btn-circle-wrap {
  margin-bottom: 0 !important;
}

.x-icon [class*="container-pages"] .x-btn:hover {
  font-weight: 300;
  text-shadow: 0 0.075em 0.075em rgba(0, 0, 0, 0.5);
  text-transform: none;
  border-width: 1px;
  color: #fff;
  border-color: #600900;
  background-color: #ef2201;
  border-radius: 0.225em;
  -webkit-box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0, 0, 0, 0.75);
}


/*
// Specific.
*/

.x-icon .container-pages-shortcodes,
.x-icon .container-pages-features {
  text-align: center;
}

.x-icon .container-pages-shortcodes .p-pages,
.x-icon .container-pages-features .p-pages {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.x-icon .container-pages-pages .p-pages {
  max-width: 60%;
}

.x-icon .container-pages-layouts .p-pages {
  max-width: 82%;
}



/* Pages Mobile Styles
// ========================================================================== */

@media (max-width: 979px) {
  .x-integrity [class*="container-pages"] .h-pages,
  .x-renew [class*="container-pages"] .h-pages,
  .x-icon [class*="container-pages"] .h-pages {
    font-size: 42px;
  }
}

@media (max-width: 767px) {
  .x-integrity [class*="container-pages"] .h-pages,
  .x-renew [class*="container-pages"] .h-pages,
  .x-icon [class*="container-pages"] .h-pages {
    font-size: 36px;
  }

  .x-integrity [class*="container-pages"] .p-pages,
  .x-renew [class*="container-pages"] .p-pages,
  .x-icon [class*="container-pages"] .p-pages {
    font-size: 18px;
  }
}

@media (max-width: 480px) {
  .x-integrity [class*="container-pages"] .h-pages,
  .x-renew [class*="container-pages"] .h-pages,
  .x-icon [class*="container-pages"] .h-pages {
    font-size: 32px;
  }

  .x-integrity .container-pages-shortcodes .x-btn-circle-wrap,
  .x-integrity .container-pages-shortcodes .x-btn,
  .x-integrity .container-pages-features .x-btn-circle-wrap,
  .x-integrity .container-pages-features .x-btn,
  .x-integrity .container-pages-pages .x-btn-circle-wrap,
  .x-integrity .container-pages-pages .x-btn,
  .x-renew .container-pages-shortcodes .x-btn-circle-wrap,
  .x-renew .container-pages-shortcodes .x-btn,
  .x-renew .container-pages-features .x-btn-circle-wrap,
  .x-renew .container-pages-features .x-btn,
  .x-renew .container-pages-pages .x-btn-circle-wrap,
  .x-renew .container-pages-pages .x-btn,
  .x-icon .container-pages-shortcodes .x-btn-circle-wrap,
  .x-icon .container-pages-shortcodes .x-btn,
  .x-icon .container-pages-features .x-btn-circle-wrap,
  .x-icon .container-pages-features .x-btn,
  .x-icon .container-pages-pages .x-btn-circle-wrap,
  .x-icon .container-pages-pages .x-btn {
    display: block;
  }
}



/* Buttons
// ========================================================================== */

.container-shortcode-buttons .h-custom-headline {
  margin-top: 2.75em;
}

.container-shortcode-buttons .x-btn {
  margin-top: 6px;
}

.container-shortcode-buttons .x-btn.x-btn-real,
.container-shortcode-buttons .x-btn.x-btn-flat {
  border-width: 1px;
  text-transform: none;
}

.container-shortcode-buttons .x-btn-red.x-btn,
.container-shortcode-buttons .x-btn-red .x-btn {
  color: #fff;
  border-color: #a50500;
  background-color: #e84533;
}

.container-shortcode-buttons .x-btn-red.x-btn:hover,
.container-shortcode-buttons .x-btn-red .x-btn:hover {
  color: #fff;
  border-color: #5e0600;
  background-color: #e85140;
}

.container-shortcode-buttons .x-btn-red.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-red .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #b22617, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #b22617, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-gray.x-btn,
.container-shortcode-buttons .x-btn-gray .x-btn {
  color: #fff;
  border-color: #6e787a;
  background-color: #7f8c8d;
}

.container-shortcode-buttons .x-btn-gray.x-btn:hover,
.container-shortcode-buttons .x-btn-gray .x-btn:hover {
  color: #fff;
  border-color: #5e686b;
  background-color: #697275;
}

.container-shortcode-buttons .x-btn-gray.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-gray .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #5f6768, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #5f6768, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-blue-green.x-btn,
.container-shortcode-buttons .x-btn-blue-green .x-btn {
  color: #fff;
  border-color: #0445a5;
  background-color: #2980b9;
}

.container-shortcode-buttons .x-btn-blue-green.x-btn:hover,
.container-shortcode-buttons .x-btn-blue-green .x-btn:hover {
  color: #fff;
  border-color: #0c3356;
  background-color: #215d99;
}

.container-shortcode-buttons .x-btn-blue-green.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-blue-green .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #1699ad, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #1699ad, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-green.x-btn,
.container-shortcode-buttons .x-btn-green .x-btn {
  color: #fff;
  border-color: #117a6c;
  background-color: #16a085;
}

.container-shortcode-buttons .x-btn-green.x-btn:hover,
.container-shortcode-buttons .x-btn-green .x-btn:hover {
  color: #fff;
  border-color: #159b7c;
  background-color: #1abc9c;
}

.container-shortcode-buttons .x-btn-green.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-green .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #117c63, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #117c63, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-purple.x-btn,
.container-shortcode-buttons .x-btn-purple .x-btn {
  color: #e0ceef;
  border-color: #8f2fb5;
  background-color: #9b59b6;
}

.container-shortcode-buttons .x-btn-purple.x-btn:hover,
.container-shortcode-buttons .x-btn-purple .x-btn:hover {
  color: #e2c8f4;
  border-color: #442141;
  background-color: #75448c;
}

.container-shortcode-buttons .x-btn-purple.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-purple .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #601d70, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #601d70, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-yellow.x-btn,
.container-shortcode-buttons .x-btn-yellow .x-btn {
  color: #000;
  border-color: #d6a700;
  background-color: #ffba00;
}

.container-shortcode-buttons .x-btn-yellow.x-btn:hover,
.container-shortcode-buttons .x-btn-yellow .x-btn:hover {
  color: #fff;
  border-color: #d6a700;
  background-color: #ffba00;
}

.container-shortcode-buttons .x-btn-yellow.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-yellow .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #dd9933, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #dd9933, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-orange-green.x-btn,
.container-shortcode-buttons .x-btn-orange-green .x-btn {
  color: #fff;
  border-color: #ac1100;
  background-color: #d35400;
}

.container-shortcode-buttons .x-btn-orange-green.x-btn:hover,
.container-shortcode-buttons .x-btn-orange-green .x-btn:hover {
  color: #fff;
  border-color: #008256;
  background-color: #00d873;
}

.container-shortcode-buttons .x-btn-orange-green.x-btn.x-btn-real,
.container-shortcode-buttons .x-btn-orange-green .x-btn.x-btn-real {
  -webkit-box-shadow: 0 0.25em 0 0 #4f3700, 0 4px 9px rgba(0, 0, 0, 0.75);
          box-shadow: 0 0.25em 0 0 #4f3700, 0 4px 9px rgba(0, 0, 0, 0.75);
}

.container-shortcode-buttons .x-btn-green-transparent.x-btn,
.container-shortcode-buttons .x-btn-green-transparent .x-btn {
  color: #1abc9c;
  border-color: #1abc9c;
}

.container-shortcode-buttons .x-btn-green-transparent.x-btn:hover,
.container-shortcode-buttons .x-btn-green-transparent .x-btn:hover {
  color: #555;
  border-color: #555;
}

.container-shortcode-buttons .x-btn-gray-blue-transparent.x-btn,
.container-shortcode-buttons .x-btn-gray-blue-transparent .x-btn {
  color: #34495e;
  border-color: #34495e;
}

.container-shortcode-buttons .x-btn-gray-blue-transparent.x-btn:hover,
.container-shortcode-buttons .x-btn-gray-blue-transparent .x-btn:hover {
  color: #bdc3C7;
  border-color: #bdc3C7;
}

.container-shortcode-buttons .x-btn-yellow-transparent.x-btn,
.container-shortcode-buttons .x-btn-yellow-transparent .x-btn {
  color: #fff;
  border-color: #ecf0f1;
}

.container-shortcode-buttons .x-btn-yellow-transparent.x-btn:hover,
.container-shortcode-buttons .x-btn-yellow-transparent .x-btn:hover {
  color: #fff;
  border-color: #ffba00;
}

.container-shortcode-buttons .x-btn-circle-wrap .x-btn {
  margin-top: 0;
}



/* Slider Buttons
// ========================================================================== */

.x-integrity .stacks_btn_2 .x-btn,
.x-integrity .experts_btn_2 .x-btn,
.x-integrity .customizer_btn_2 .x-btn {
  color: #fff;
  background-color: #ea79d2;
  border-width: 1px;
}

.x-integrity .stacks_btn_5 .x-btn,
.x-integrity .experts_btn_5 .x-btn,
.x-integrity .customizer_btn_5 .x-btn {
  color: #fff;
  background-color: #2dcc9e;
  border-width: 1px;
}

.x-integrity .stacks_btn_5 .x-btn:hover,
.x-integrity .experts_btn_5 .x-btn:hover,
.x-integrity .customizer_btn_5 .x-btn:hover {
  color: #fff;
  background-color: #30e4af;
}

.x-integrity .stacks_btn_9 .x-btn,
.x-integrity .experts_btn_9 .x-btn,
.x-integrity .customizer_btn_9 .x-btn {
  border-color: #2ecc71;
}

.x-integrity .stacks_btn_9 .x-btn:hover,
.x-integrity .experts_btn_9 .x-btn:hover,
.x-integrity .customizer_btn_9 .x-btn:hover {
  border-color: #25af60;
}

.x-renew .stacks_btn_4 .x-btn,
.x-renew .experts_btn_4 .x-btn,
.x-renew .customizer_btn_4 .x-btn {
  color: #fff;
  border-color: #f771ab;
  background-color: #f771ab;
  border-width: 1px;
}

.x-renew .stacks_btn_4 .x-btn:hover,
.x-renew .experts_btn_4 .x-btn:hover,
.x-renew .customizer_btn_4 .x-btn:hover {
  color: #fff;
  border-color: #ee45af;
  background-color: #ee45af;
}

.x-renew .stacks_btn_5 .x-btn,
.x-renew .experts_btn_5 .x-btn,
.x-renew .customizer_btn_5 .x-btn {
  color: #131313;
  border-color: #15b3db;
}

.x-renew .stacks_btn_5 .x-btn:hover,
.x-renew .experts_btn_5 .x-btn:hover,
.x-renew .customizer_btn_5 .x-btn:hover {
  color: #131313;
  border-color: #109ec3;
}

.x-renew .stacks_btn_8 .x-btn,
.x-renew .experts_btn_8 .x-btn,
.x-renew .customizer_btn_8 .x-btn {
  color: #fff;
  border-color: #ac1100;
  background-color: #ff2a13;
  border-width: 1px;
}

.x-renew .stacks_btn_8 .x-btn:hover,
.x-renew .experts_btn_8 .x-btn:hover,
.x-renew .customizer_btn_8 .x-btn:hover {
  color: #fff;
  border-color: #600900;
  background-color: #ef2201;
}

.x-icon .stacks_btn_2 .x-btn,
.x-icon .experts_btn_2 .x-btn,
.x-icon .customizer_btn_2 .x-btn {
  border-color: #000;
}

.x-icon .stacks_btn_2 .x-btn:hover,
.x-icon .experts_btn_2 .x-btn:hover,
.x-icon .customizer_btn_2 .x-btn:hover {
  border-color: #0099cc;
}

.x-icon .stacks_btn_6 .x-btn,
.x-icon .experts_btn_6 .x-btn,
.x-icon .customizer_btn_6 .x-btn {
  color: #fff;
  border-color: #01baba;
  background-color: #01baba;
  border-width: 1px;
}

.x-icon .stacks_btn_6 .x-btn:hover,
.x-icon .experts_btn_6 .x-btn:hover,
.x-icon .customizer_btn_6 .x-btn:hover {
  color: #fff;
  border-color: #00d3d3;
  background-color: #00d3d3;
}



/* Icon Examples
// ========================================================================== */

.icon-examples {
  font-size: 16px;
}

.icon-examples .x-column {
  text-align: center;
}

.icon-examples .x-icon,
.icon-examples .x-social {
  display: block;
  margin-top: 48px;
  font-size: 64px;
  line-height: 1.3;
}

.icon-examples .x-icon:first-child,
.icon-examples .x-social:first-child {
  margin-top: 0;
}



/* Shortcodes - Buy Band
// ========================================================================== */

.band-buy h1 a {
  display: inline-block;
  margin: 30px 0 15px;
  border: 3px solid #000;
  padding: 10px 20px;
  font-weight: 300;
  background-color: #ffff00;
}

.band-buy h1 a:hover {
  color: #ffff00 !important;
  border-color: #000 !important;
  background-color: #000 !important;
}



/* Shortcodes - Demo Columns
// ========================================================================== */

.demo-column {
  width: 25%;
  padding: 4%;
  float: left;
  text-align: center;
  height: 965px;
}

.demo-column .img-wrap {
  margin: 0 -3.5%;
  text-align: center;
}

.demo-column .p-sub {
  margin-bottom: 0;
  margin-top: 15px;
}

.demo-column .btn-demo-column {
  display: inline-block;
  border: 2px solid;
  padding: 9px 18px 10px 20px;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  -webkit-transition: opacity 0.3s ease;
          transition: opacity 0.3s ease;
}

.demo-column .btn-demo-column.demo {
  margin: 35px 0px;
}

.demo-column .btn-demo-column.features {
  padding: 7px 10px 7px 12px;
  font-size: 11px;
}

.demo-column a {
  -webkit-transition: opacity 0.3s ease;
          transition: opacity 0.3s ease;
}

@media (max-width: 1280px) {
  .demo-column {
    width: 50%;
    height: 970px;
    padding: 6% 4%;
  }
}

@media (max-width: 767px) {
  .demo-column {
    width: 100%;
    height: auto;
    padding: 10% 4%;
  }
}


/*
// Demo column - Integrity.
*/

.demo-column.integrity {
  color: #6c6c6c;
  background-color: #f6f6f6;
}

.demo-column.integrity a {
  color: #6c6c6c;
}

.demo-column.integrity a:hover {
  color: #6c6c6c;
  opacity: 0.5;
}

.demo-column.integrity .btn-demo-column {
  color: #6c6c6c;
  border-color: #6c6c6c;
}


/*
// Demo column - Renew.
*/

.demo-column.renew {
  color: #ffffff;
  background-color: #00002b;  
}

.demo-column.renew a {
  color: #ffffff;
}

.demo-column.renew a:hover {
  color: #ffffff;
  opacity: 0.5;
}

.demo-column.renew .btn-demo-column {
  color: #ffffff;
  border-color: #ffffff;
}


/*
// Demo column - Icon.
*/

.demo-column.icon {
  color: #ffffff;
  background-color: #00cc66;
}

.demo-column.icon a {
  color: #ffffff;
}

.demo-column.icon a:hover {
  color: #ffffff;
  opacity: 0.5;
}

.demo-column.icon .btn-demo-column {
  color: #ffffff;
  border-color: #ffffff;
}


/*
// Demo column - Ethos.
*/

.demo-column.ethos {
  color: #655243;
  background-color: #f7f0e3;
}

.demo-column.ethos a {
  color: #655243;
}

.demo-column.ethos a:hover {
  color: #655243;
  opacity: 0.5;
}

.demo-column.ethos .btn-demo-column {
  color: #655243;
  border-color: #655243;
}

.demo-column.ethos .last {   
  padding-bottom: 267px;
}


/*
// Demo column - lists.
*/

.ul-demos {
  margin-left: 0 !important;
  padding-top: 20px;
  text-indent: 0 !important;
}

.ul-demos.integrity { border-top: 1px solid #c2c2c2; }
.ul-demos.ethos     { border-top: 1px solid #c4b89e; }
.ul-demos.renew     { border-top: 1px solid #666680; }
.ul-demos.icon      { border-top: 1px solid #80e6b3; }

.ul-demos li {
  font-size: 18px;
  font-weight: 300;
  text-align: center;
  color: #b5b5b5;
  line-height: 36px;
}

.ul-demos .last {
  margin-bottom: 10px;
  border-bottom: 1px solid;
  padding-bottom: 15px;
}

.ul-demos.renew .last {
  border-color: #666680;
}

.ul-demos.integrity .last {
  border-color: #c2c2c2;
}

.ul-demos.icon .last {
  border-color: #80e6b3;
}

.ul-demos.ethos .last {
  border-color: #c4b89e;
}