/* Dark Version */
html.dark {

	body {
		background-color: $dark-bg;
	}

	&.boxed {
		.body {
			background-color: $dark-bg;
		}
	}

	// Header
	#header {
		background: $dark-bg;
		border-top-color: $darken-color-1;
		border-radius: corner-values(6px 6px 0 0);

		nav ul.nav-top li a:hover {
			background-color: $dark-color-3;
		}

		nav.mega-menu ul.nav-main li.mega-menu-item {
			.mega-menu-sub-title {
				color: #FFF;
			}
			ul.dropdown-menu {
				background-color: $dark-color-3 !important;
			}
			&:hover ul.sub-menu li:hover a:hover {
				background-color: darken($dark-bg, 8%) !important;
			}
			.form-control {
				background-color: $dark-color-4 !important;
				border-color: $dark-color-4 !important;
				color: #FFF !important;
			}
		}

		nav.mega-menu ul.nav-main .mega-menu-signin a,
		nav.mega-menu ul.nav-main .mega-menu-signin a:hover,
		nav.mega-menu ul.nav-main .mega-menu-signin.logged .user-avatar strong {
			color: #FFF;
		}

		nav.mega-menu .mega-menu-signin ul.dropdown-menu {
			&:hover li:hover li:hover a {
				color: #d9d9d9;
			}
		}

		.search input.search:focus {
			border-color: $dark-color-3;
		}

		&.clean-top .header-top {
			background: $dark-color-2;
			border-bottom-color: $dark-color-3;
		}

		&.narrow {
			border-bottom-color: $dark-color-2;
		}

		nav.mega-menu .mega-menu-shop .actions-continue {
			border-top-color: $dark-color-2;
		}

		nav.mega-menu .mega-menu-shop .dropdown-menu li table tr td a {
			color: #FFF;
		}

		nav.mega-menu .mega-menu-shop a {
			color: #FFF;
		}

	}

	body.sticky-menu-active #header {
		border-bottom-color: $dark-color-3;
	}

	// Headings
	h1, h2, h3, h4, h5, h6 {
		color: #FFF;
	}

	.alert h1, .alert h2, .alert h3, .alert h4, .alert h5, .alert h6 {
		color: #111;
	}

	// Blockquote
	blockquote {
		border-color: $dark-color-3;
	}

	// Sections
	section.featured {
		background-color: $darken-color-1;
		border-top-color: $dark-color-4;
		&.map {
			background-image: url(../img/map-bottom-dark.png);	
		}
	}

	section.call-to-action:before {
		border-top-color: $dark-color-4;
	}

	// Timeline
	section.timeline {
		&:after {
			background: rgb(80,80,80);
			background: -moz-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(100%,rgba(125,185,232,1)));
			background: -webkit-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
			background: -o-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
			background: -ms-linear-gradient(top, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
			background: linear-gradient(to bottom, rgba(80,80,80,0) 0%, rgb(80,80,80) 8%, rgb(80,80,80) 92%, rgba(80,80,80,0) 100%);
		}
		.timeline-date {
			background-color: $dark-color-3;
			border-color: $dark-color-3;
			text-shadow: none;
		}
		.timeline-title {
			background: $dark-color-3;
		}
		.timeline-box {
			border-color: $dark-color-3;
			background: $dark-color-3;
			&.left {
				&:before {
					box-shadow: 0 0 0 3px $dark-color-3, 0 0 0 6px $dark-color-3;
				}
				&:after {
					background: $dark-color-3;
					border-#{$right}-color: $dark-color-3;
					border-top-color: $dark-color-3;
				}
			}
			&.right {
				&:before {
					box-shadow: 0 0 0 3px $dark-color-3, 0 0 0 6px $dark-color-3;
				}
				&:after {
					background: $dark-color-3;
					border-#{$left}-color: $dark-color-3;
					border-bottom-color: $dark-color-3;
				}
			}
		}
	}

	// Form
	.form-control {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
	}

	// Buttons
	.btn-default {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
		color: #FFF;
	}

	.btn.disabled,
	.btn[disabled] {
		border-color: $dark-color-3 !important;
	}

	// Pagination
	.pagination > li > a,
	.pagination > li > span {
		background-color: $dark-color-3;
		border-color: $dark-color-5;
	}

	// Sliders
	.theme-default .nivoSlider {
		background-color: $dark-bg;
	}

	// Home
	.map-section {
		background-image: url(../img/map-top-dark.png);
	}

	.home-concept {
		background-image: url(../img/home-concept-dark.png);
		.process-image {
			background-image: url(../img/home-concept-item-dark.png);
		}
		.project-image {
			background-image: url(../img/home-concept-item-dark.png);
		}
		.sun {
			background-image: url(../img/home-concept-icons-dark.png);
		}
		.cloud {
			background-image: url(../img/home-concept-icons-dark.png);
		}
	}

	// Page Top
	.page-top {
		border-bottom-color: $darken-color-1;
	}

	// Panels
	.panel-group {
		.panel {
			background-color: $dark-color-3;
		}
		.panel-default {
			border-color: $dark-color-3;
		}
		.panel-heading {
			background-color: $dark-color-4;
		}

		.form-control {
			background-color: $dark-color-2;
			border-color: $dark-color-2;
		}

	}

	// Toggles
	.toggle > label {
		background-color: $dark-color-4;
	}

	// Featured Boxes
	.featured-box {
		background: $dark-color-4;
		border-#{$left}-color: $dark-color-4;
		border-#{$right}-color: $dark-color-4;
		border-bottom-color: $dark-color-4;
		&.secundary h4 {
			color: #FFF;
		}
	}

	// Feature Boxes
	.feature-box {
		&.secundary h4 {
			color: #FFF;
		}
	}

	// Progress Bars
	.progress {
		background: $dark-color-4;
	}

	// Arrow
	.arrow {
		background-image: url(../img/arrows-dark.png);
	}

	// Thumbnail
	.thumbnail,
	.img-thumbnail {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
	}

	.thumb-info-social-icons {
		border-top-color: lighten($dark-bg, 12%);
	}

	// Lists
	ul.nav-list.primary > li a {
		border-bottom-color: $dark-color-3;
		&:hover {
			background-color: $dark-color-3;
		}
	}

	// Tabs
	.tabs {

		.nav-tabs li a,
		.nav-tabs li a:hover {
			border-top-color: $dark-color-3;
			border-#{$left}-color: $dark-color-3;
			border-#{$right}-color: $dark-color-3;
			background: $dark-color-3;
		}

		.nav-tabs.nav-justified li a,
		.nav-tabs.nav-justified li a:hover {
			border-bottom-color: $dark-color-3;
		}

		&.tabs-left .nav-tabs > li a,
		&.tabs-right .nav-tabs > li a {
			background: $dark-color-3;
			border-#{$left}-color: $dark-color-3;
			border-#{$right}-color: $dark-color-3;
		}

		&.tabs-left .nav-tabs > li:last-child a,
		&.tabs-right .nav-tabs > li:last-child a {
			border-bottom-color: $dark-color-3;
		}

		.nav-tabs {
			border-color: $dark-color-3;
		}

		.nav-tabs li.active a,
		.nav-tabs li.active a:hover,
		.nav-tabs li.active a:focus {
			background: $dark-color-4;
			border-#{$left}-color: $dark-color-4;
			border-#{$right}-color: $dark-color-4;
		}

		.nav-tabs.nav-justified li.active a {
			border-bottom-color: $dark-color-4;
		}

		&.tabs-vertical {
			border-top-color: $dark-color-4;
		}

		&.tabs-bottom .nav-tabs li a,
		&.tabs-bottom .nav-tabs li a:hover {
			border-bottom-color: $dark-color-3;
		}

		.tab-content {
			background: $dark-color-4;
			border-color: $dark-color-4;
		}

	}

	// Misc
	.testimonial-author strong {
		color: #FFF;
	}

	.page-header {
		border-bottom-color: $dark-color-3;
	}

	.table > thead > tr > th,
	.table > tbody > tr > th,
	.table > tfoot > tr > th,
	.table > thead > tr > td,
	.table > tbody > tr > td,
	.table > tfoot > tr > td,
	.table-bordered {
		border-color: $dark-color-3;
	}

	.table-striped > tbody > tr:nth-child(2n+1) > td,
	.table-striped > tbody > tr:nth-child(2n+1) > th {
		background-color: $dark-color-4;
	}

	pre {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
		color: $color-default;
	}

	.show-grid [class*="col-md-"] .show-grid-block {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
	}

	// Divider Line
	hr {
		@include background-image(linear-gradient(left, transparent, rgba(255, 255, 255, 0.2), transparent));
		&.light {
			@include background-image(linear-gradient(left, transparent, rgba(0, 0, 0, 0.2), transparent));
		}
	}

	// History
	ul.history {
		li {
			.thumb {
				background-image: url(../img/history-thumb-dark.png);
				@include if-rtl {
					background-position: 0 -200px;
				}
			}
		}
	}

	// Blog
	.blog-posts article {
		border-color: $dark-color-3;
	}

	section.featured .recent-posts .date .day,
	article.post .post-date .day {
		background-color: $dark-color-3;
	}

	article .post-video,
	article .post-video iframe,
	article .post-audio,
	article .post-audio iframe {
		background-color: $dark-color-3;
		border-color: $dark-color-3;
	}

	ul.simple-post-list li {
		border-bottom-color: $dark-color-2;
	}

	.post-block {
		border-top-color: $darken-color-1;
	}

	ul.comments .comment-block{
		background-color: $dark-color-3;
	}

	ul.comments .comment-arrow {
		border-#{$right}-color: $dark-color-3;
	}

	// Pricing Tables
	.pricing-table {
		li {
			border-top-color: $dark-color-2;
		}
		h3 {
			background-color: $dark-color-2;
			text-shadow: none;
			span {
				background: $dark-color-3;
				border-color: $dark-color-5;
				box-shadow: 0 5px 20px $dark-color-5 inset, 0 3px 0 $dark-color-3 inset;
				color: $color-default;
			}
		}
		.most-popular {
			border-color: $dark-color-3;
			h3 {
				background-color: $dark-color-3;
				color: #FFF;
				text-shadow: none;
			}
		}

		.plan-ribbon {
			background-color: $dark-color-3;
		}
		.plan {
			background: $dark-color-3;
			border: 1px solid $dark-color-3;
			color: $color-default;
			text-shadow: none;
		}
	}

	// Shop
	.product-thumb-info {
		background-color: $dark-color-3;
		border-color: transparent;
	}

	.shop .quantity .qty {
		background-color: $dark-color-3;
		border-color: transparent;
	}

	.shop .quantity .minus,
	.shop .quantity .plus {
		background-color: $dark-color-2;
		border-color: transparent;
	}

	.shop table.cart td,
	.shop .cart-totals th,
	.shop .cart-totals td {
		border-color: $dark-color-3;
	}

	// Modal
	.modal-content {
		background-color: $dark-bg;
	}

	.modal-header {
		border-bottom-color: $dark-color-3;
		h1, h2, h3, h4, h5, h6 {
			color: $color-default;
		}
		.close {
			text-shadow: none;
			color: #FFF;
		}
	}

	.modal-footer {
		border-top-color: $dark-color-3;	
	}

	// Footer
	#footer {
		.newsletter form .btn-default {
			background-color: $dark-color-2;
			border-color: $dark-color-2;
			color: $color-default;
		}
	}

}

/* Responsive */
@media (max-width: 991px) {

	html.dark #header nav.mega-menu ul.nav-main li.mega-menu-item ul.dropdown-menu {
		background: transparent !important;
	}

}