/**
 * iRibbon Pro 2 Skins
 *
 * Skins for iRibbon Pro 2
 *
 * Please do not edit this file. This file is part of the Cyber Chimps Framework and all modifications
 * should be made in a child theme.
 *
 * @category CyberChimps Framework
 * @package  Framework
 * @since    1.0
 * @author   CyberChimps
 * @license  http://www.opensource.org/licenses/gpl-license.php GPL v3.0 (or later)
 * @link     http://www.cyberchimps.com/
 */
/************************************************************************************************************/
/********************************************* MAIN HTML ****************************************************/
/************************************************************************************************************/
/* BLACK-RED ===================*/
/* RED-GREEN ===================
@col1: #b4c38c;
@col1light: lighten( @col1, 10% );
@col1dark:  darken( @col1, 10% );
@col1darker: darken( @col1, 20% );
@col2: #91342e;
@col2light: lighten( @col2, 10% );
@col2dark: darken( @col2, 10% );
@col2darker: darken( @col2, 20% );
@col3: #e9e3bb;
@shadow: #777777;
@sidebar: #777777;*/
body {
  background: url("images/black-red/bg.jpg");
}
a {
  color: #ff0d01;
}
a:hover {
  color: #333333;
}
.site-title,
.box-widget-title,
.entry-title,
.widget-title,
.recent_posts_post_title,
#callout_section_section,
.carousel_caption,
.cyberchimps-product-title,
.respond-title,
.comments-title,
#portfolio_pro_section h2 {
  font-family: lobster, cursive;
}
/************************************************************************************************************/
/********************************************* COL1 GRADIENT ************************************************/
/************************************************************************************************************/
#navigation .navbar-inner,
#sidebar h3.widget-title,
#pagination ul li a,
#pagination span.page-numbers,
#cyberchimps_product_text h2,
#twitter_bar #twitter-text li {
  background: #cd0a00;
  /* Old browsers */

  background: -moz-linear-gradient(top, #ff0d01 0%, #cd0a00 100%);
  /* FF3.6+ */

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff0d01), color-stop(100%, #cd0a00));
  /* Chrome,Safari4+ */

  background: -webkit-linear-gradient(top, #ff0d01 0%, #cd0a00 100%);
  /* Chrome10+,Safari5.1+ */

  background: -o-linear-gradient(top, #ff0d01 0%, #cd0a00 100%);
  /* Opera 11.10+ */

  background: -ms-linear-gradient(top, #ff0d01 0%, #cd0a00 100%);
  /* IE10+ */

  background: linear-gradient(to bottom, #ff0d01 0%, #cd0a00 100%);
  /* W3C */

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@col1', endColorstr='@col1dark', GradientType=0);
  /* IE6-9 */

}
/************************************************************************************************************/
/********************************************* COL2 GRADIENT ************************************************/
/************************************************************************************************************/
.navbar .btn-navbar,
div.ribbon-top,
#widget-boxes-container .cc-widget-title-container,
#pagination ul li a:hover,
#pagination ul li.active a,
.cyberchimps-product-link a.btn,
#widget-boxes-container .ribbon-bottom-container {
  background: #1a1a1a;
  /* Old browsers */

  background: -moz-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* FF3.6+ */

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #1a1a1a));
  /* Chrome,Safari4+ */

  background: -webkit-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* Chrome10+,Safari5.1+ */

  background: -o-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* Opera 11.10+ */

  background: -ms-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* IE10+ */

  background: linear-gradient(to bottom, #333333 0%, #1a1a1a 100%);
  /* W3C */

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@col2', endColorstr='@col2dark', GradientType=0);
  /* IE6-9 */

}
/************************************************************************************************************/
/********************************************* TRIANGLES ****************************************************/
/************************************************************************************************************/
/* ==================================== BOTTOM LEFT TRIANGLE COL1 ================================================== */
#sidebar.sidebar-left .widget-container .cc-widget-title-container:before,
#sidebar.sidebar-right .widget-container .cc-widget-title-container:before,
.text-left #cyberchimps_product_text h2:before {
  border-color: #9a0700 transparent transparent;
}
/* ==================================== BOTTOM RIGHT TRIANGLE COL1 ================================================== */
#sidebar.sidebar-left .widget-container .cc-widget-title-container:after,
#sidebar.sidebar-right .widget-container .cc-widget-title-container:after,
#twitter_bar #twitter-text li:after,
.text-right #cyberchimps_product_text h2:before {
  border-color: transparent transparent transparent #9a0700;
}
/* ==================================== BOTTOM LEFT TRIANGLE COL2 ================================================== */
div.ribbon-top:before,
#widget-boxes-container .cc-widget-title-container:before {
  border-color: transparent #000000 transparent transparent;
}
/* ==================================== BOTTOM RIGHT TRIANGLE COL2 ================================================== */
div.ribbon-top:after,
#widget-boxes-container .cc-widget-title-container:after {
  border-color: transparent transparent transparent #000000;
}
/* ==================================== TOP LEFT TRIANGLE COL2 ================================================== */
#widget-boxes-container .ribbon-bottom:before {
  border-color: transparent #000000 transparent transparent;
}
/* ==================================== TOP RIGHT TRIANGLE COL2 ================================================== */
#widget-boxes-container .ribbon-bottom:after {
  border-color: transparent transparent transparent #000000;
}
/************************************************************************************************************/
/********************************************* MENU *********************************************************/
/************************************************************************************************************/
.ribbon-left-cut {
  position: absolute;
  top: 17px;
  left: -55px;
  width: 50px;
  height: 50px;
  background: url("images/black-red/title-ribbon-left.png") no-repeat 0 0 transparent;
}
.ribbon-right-cut {
  position: absolute;
  right: -75px;
  bottom: -13px;
  width: 50px;
  height: 50px;
  background: url("images/black-red/title-ribbon-right.png") no-repeat 0 0 transparent;
}
.ribbon-left,
.ribbon-right {
  background: #cd0a00;
}
#navigation:before {
  border-color: #9a0700 transparent transparent;
}
#navigation .container:after {
  border-color: transparent transparent transparent #9a0700;
}
.navbar .nav li.current-menu-ancestor.dropdown > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown > a:hover .caret {
  border-top-color: #ffffff;
  border-bottom-color: #ffffff;
}
.dropdown-menu {
  border: 1px solid #ff0d01;
}
.dropdown-menu li {
  border-bottom: 1px solid #ff0d01;
}
.dropdown-menu > li ul {
  border-top: 1px solid #ff0d01;
}
#navigation .active > a,
#navigation a:hover,
#navigation .nav > li.current-menu-ancestor > a {
  color: #ffffff;
}
#navigation .navbar-inner .dropdown-menu .active > a,
#navigation .navbar-inner .dropdown-menu a:hover,
#navigation .dropdown-menu .current-menu-ancestor.dropdown > a {
  color: #ff0d01;
}
/************************************************************************************************************/
/********************************************* MAIN CONTENT *************************************************/
/************************************************************************************************************/
header#cc-header h2.site-title a,
#gallery h2 {
  color: #333333;
}
h1.entry-title,
h2.entry-title,
h2.respond-title,
h2.comments-title {
  color: #ffffff;
}
h1.entry-title a,
h2.entry-title a {
  color: #ffffff;
}
h1.entry-title a:hover,
h2.entry-title a:hover {
  color: #e6e6e6;
}
#sidebar a:hover {
  color: #ffffff;
}
/************************************************************************************************************/
/********************************************* SIDEBAR ******************************************************/
/************************************************************************************************************/
#sidebar {
  background: #dddddd;
}
#sidebar h3.widget-title,
h3.widget-title {
  color: #ffffff;
}
#sidebar.sidebar-right h3.widget-title:after {
  background: url("images/black-red/ribbon-sidebar-right.png") no-repeat 0 0 transparent;
}
#sidebar.sidebar-left h3.widget-title:after {
  background: url("images/black-red/ribbon-sidebar-left.png") no-repeat 0 0 transparent;
}
/************************************************************************************************************/
/********************************************* FOOTER *******************************************************/
/************************************************************************************************************/
#footer-widgets {
  color: #ffffff;
}
#footer-widgets a:hover {
  color: #ffffff;
}
.site-footer #copyright {
  color: #ffffff;
}
/************************************************************************************************************/
/********************************************* ELEMENTS *****************************************************/
/************************************************************************************************************/
/* ==================================== CALLOUT ================================================== */
#callout_section_section {
  border-top: 3px solid #cd0a00;
  border-bottom: 3px solid #cd0a00;
  background: #ff0d01;
  color: #ffffff;
}
#callout_button a {
  background: #1a1a1a;
  /* Old browsers */

  background: -moz-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* FF3.6+ */

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #1a1a1a));
  /* Chrome,Safari4+ */

  background: -webkit-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* Chrome10+,Safari5.1+ */

  background: -o-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* Opera 11.10+ */

  background: -ms-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  /* IE10+ */

  background: linear-gradient(to bottom, #333333 0%, #1a1a1a 100%);
  /* W3C */

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@col2', endColorstr='@col2dark', GradientType=0);
  /* IE6-9 */

}
#callout_button a:hover {
  background: #1a1a1a;
}
/* ==================================== WIDGET BOXES ============================================= */
#widget-boxes-container .cc-widget-title-container h2 {
  color: #ffffff;
}
/* ==================================== BOXES ==================================================== */
#boxes-container .box:before,
#boxes-container .box:after {
  position: absolute;
  top: 80%;
  bottom: 15px;
  left: 10px;
  z-index: -1;
  max-width: 300px;
  width: 50%;
  background: #777777;
  -webkit-box-shadow: 0 15px 10px #777777;
  -moz-box-shadow: 0 15px 10px #777777;
  box-shadow: 0 15px 10px #777777;
  content: "";
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
#boxes-container .box:after {
  right: 10px;
  left: auto;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  transform: rotate(3deg);
}
/* ==================================== CAROUSEL ================================================== */
#carousel_section_section .es-nav span {
  top: 40%;
  width: 50px;
  height: 42px;
  background: url("images/black-red/carousel-nav.png") no-repeat scroll left top transparent;
}
#carousel_section_section .es-nav span.es-nav-next {
  right: -30px;
  background-position: right top;
}
#carousel_section_section .es-nav span.es-nav-prev {
  left: -30px;
}
/* ==================================== PORTFOLIO ================================================== */
.carousel_caption {
  color: #333333;
}
#gallery .portfolio_item img {
  border: 3px solid #ff0d01;
}
/* ==================================== TWITTER ================================================== */
#twitter_bar #twitter_text li {
  background: #ff0d01;
}
#twitter_bar #twitter_text li:before {
  background-image: url('images/black-red/ribbon-sidebar-right.png');
}
#twitter_bar .twitter-img {
  border: 2px solid #ff0d01;
}
#twitter_bar .twitter-img {
  background: url("images/black-red/bg.jpg");
}
#twitter_bar a {
  color: #ffffff;
}
#twitter_bar #twitter_text .twitter-followers a {
  color: #ff0d01;
}
/* ==================================== RECENT POSTS ================================================== */
#recent_posts h2.entry-title {
  color: #333333;
}
#recent_posts a {
  color: #333333;
}
#recent_posts a:hover {
  color: #ff0d01;
}
.recent-posts-container:before,
.recent-posts-container:after {
  position: absolute;
  top: 80%;
  bottom: 15px;
  left: 10px;
  z-index: -1;
  max-width: 300px;
  width: 50%;
  background: #777777;
  -webkit-box-shadow: 0 15px 10px #777777;
  -moz-box-shadow: 0 15px 10px #777777;
  box-shadow: 0 15px 10px #777777;
  content: "";
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.recent-posts-container:after {
  right: 10px;
  left: auto;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  transform: rotate(3deg);
}
/* ==================================== PRODUCT ================================================== */
.cyberchimps-product-title,
.cyberchimps-product-link a.btn {
  color: #ffffff;
}
.cyberchimps-product-link a.btn:hover {
  background: #333333;
}
/* MAGAZINE ===================*/
#magazine .post-title {
  color: #e9ecc9;
  background: #333333;
  background: -moz-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #1a1a1a));
  background: -webkit-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  background: -o-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  background: -ms-linear-gradient(top, #333333 0%, #1a1a1a 100%);
  background: linear-gradient(top, #333333 0%, #1a1a1a 100%);
  -webkit-box-shadow: 0 8px 5px -5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 8px 5px -5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 8px 5px -5px rgba(0, 0, 0, 0.5);
}
#magazine .post-title:before {
  border-color: transparent #000000 transparent transparent;
  content: " ";
}
#magazine .post-title a {
  color: #ffffff;
}
#magazine .post-title a:hover {
  color: #e6e6e6;
}
