/*
Theme Name:     SShop
Theme URI:    	http://demos.sshopwp.com/
Author:         shrimp2t
Author URI:     http://sshopwp.com/
Description:  	SShop is the best free WooCommerce theme. It features a bespoke integration with WooCommerce itself plus many widgets like Sales countdown, Product tabs, Blog posts, Services, Sliders. SShop is responsive mobile optimized and using bootstrap framework and FontAwesome icons. There are several layout & color options to personalise your shop, multiple widget regions, a responsive design and much more. Developers will love it's lean and extensible codebase making it a joy to customise and extend. Looking for a WooCommerce theme? Look no further!
Version:      	1.1.0
License:      	GNU General Public License v2 or later
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	sshop
Tags:         	e-commerce, two-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-menu, featured-images, full-width-template, threaded-comments, footer-widgets, sticky-post, theme-options, custom-logo

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

sshop is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/

======
Note: Do not edit this file. If you wish to add your own CSS we strongly recommend creating your own child theme, or installing a custom CSS plugin.
======
*/

@import "config";
@import "reset";
@import "layout";
@import "utilities";
@import "slider";
@import "slick";
@import "plugins";

/* WP Theme */
body {
	background: #F5F7F8;
	color: $text;
	overflow-x: hidden;
}
a, a:link, a:visited{
	color: $primary;
	outline: none;
}
a:focus, a:active, a:hover {
	text-decoration: none;
	color: $primary_hover;
}
#page {

}
.site-content {
	max-width: 1350px;
	margin: 0 auto;
	padding: 0px 15px;
}
@include for-screen( desktop-min ) {
	.container, .container-fluid {
		width: 1350px;
		max-width: 100%;
	}
}


.site-branding {
	float: left;
	min-height: 60px;

	padding: 0px 0px;
	margin-right: 30px;
	max-width: 50%;
	overflow: hidden;
	@include for-screen( phone-max ) {
		padding: 0px 10px;
		max-width: 650px;
	}
	@include for-screen( samll-phone-max ) {
		padding: 0px 10px;
		max-width: 380px;
	}
	display: block;
	position: relative;
	min-height: $header_line_height;
	max-height: $header_line_height;
	@include for-screen( phone-max ) {
		min-height: $header_line_height - 20;
		max-height: $header_line_height - 20;
	}

	.custom-logo-link {
		@include rem( 'line-height', $header_line_height );
		@include for-screen( phone-max ) {
			@include rem( 'line-height', $header_line_mobile_height );
		}
	}
	.site-title {
		margin: 0px;
		font-weight: 700;
		color: #f5f5f5;
		a {
			color: $text;
			&:hover {
				text-decoration: none;
			}
		}
		@include rem( 'font-size', 28px );
		@include rem( 'line-height', $header_line_height );
		@include for-screen( phone-max ) {
			@include rem( 'font-size', 40px - 20 );
			@include rem( 'line-height', $header_line_mobile_height );
		}
	}
	.site-description {
		display: none;
	}
}
.header-full {
	#site-header-inner {
		width: 100%;
		max-width: 100%;
		padding: 0px;
	}
	.site-branding {
		padding: 0px 30px;
		background: #222;
		a {
			color: #f5f5f5;
			&:hover {
				text-decoration: none;
			}
		}
	 }
}


.top-search-form {
	flex-grow: 1;
	width: 100%;
	display: inline-block;
	.input-group {
		border-radius: 3px;
		overflow: hidden;
	}
	.form-control ,.input-group-addon{
		padding: 10px;
		height: 44px;
	}
	.input-group-addon {
		background: $primary;
		color: #fff;
		border-color: $primary;
	}
}


.header-shop__icon {
	margin: 0px;
	display: inline-block;
	padding: 0px 15px;
	@include for-screen( phone-max ) {
		padding: 0px 8px;
	}
	@include for-screen( phone-min ) {
		position: relative;
	}

	> a {
		//z-index: 60;
		&:after {
			content: "";
			width: 16px;
			height: 16px;
			display: block;
			border: 1px solid #ededed;
			border-bottom: 0px none;
			border-right: 0px none;
			background: #fff;
			position: absolute;
			bottom: -8px;
			left: 50%;
			margin-left: -8px;
			transform: rotate(45deg);
			z-index: 999;
			visibility: hidden;
			@include transition( all .5 ease-in-out );
		}
	}

	a {
		display: block;
		position: relative;
		text-decoration: none;
		&:hover {
			text-decoration: none;
			color: $primary_hover;
		}
	}
	.shop__number {
		position: absolute;
		top: 10px;
		right: -10px;
		border-radius: 50%;
		padding: 5px;
		font-size: 12px;
		line-height: 8px;
		background: $primary;
		min-width: 18px;
		min-height: 18px;
		text-align: center;
		color: #f5f5f5;
		z-index: 4;
		visibility: hidden;
		&.show {
			visibility: visible;
		}
		&:before{
			content: "";
			display: block;
		}
		@include for-screen( phone-max ) {
			top: 2px;
			min-width: 18px;
			min-height: 18px;
			font-size: 11px;
			line-height: 8px;
		}
	}
	.shop__icon {
		@include rem( 'font-size', 20px );
		@include rem( 'line-height', $header_line_height );
		@include for-screen( phone-max ) {
			@include rem( 'line-height', $header_line_mobile_height );
			@include rem( 'font-size', 18px );
		}
	}
	.header-dropdown-inner {
		padding: 15px;
		border: 1px solid #ededed;
		margin-top: 1px;
		background: #fff;
	}
	.header-dropdown {

		display: block;
		position: absolute;
		top: 100%;
		margin-top: -2px;
		@include for-screen( phone-min ) {
			right: -15px;
			width: 300px;
			&.account-menu {
				width: $submmenu_nav_width;
			}
		}
		@include for-screen( phone-max ) {
			right: 0px;
			left: 0px;
			width: 100%;
		}
		z-index: 9;

		max-height: 0px;
		overflow: hidden;
		text-align: left;
		@include transition( all .5 ease-in-out );
		.menu {
			list-style: none;
			margin: 0px;
			padding: 0px;
			li {

			}
			a {
				padding: 5px 10px;
			}
		}
	}
	&:hover {
		&.has-dropdown {
			>a{
				&:after {
					visibility: visible;
				}
			}
		}

		.header-dropdown {
			max-height: 9999px;
			z-index: 99;
		}
	}
	.widget_shopping_cart_content {
		//display: none;
	//	opacity: 0;
	}
}

.site-header {
	background:#222222;
	.site-title {
		text-transform: uppercase;
	}
	a {
		color: $header_link_color;
	}
	background-color: #fff;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.12);
	@include clearfixAfter();
	position: relative;
	z-index: 65;
	//@include transition( all .6s ease-in-out );
}

/* Sticky header */
.header-sticky {
	#site-header {
		position: fixed;
		width: 100%;

	}
}


/*--------------------------------------------------------------
## Menu navigation
--------------------------------------------------------------*/
.main-navigation {
	display: block;
	float: left;
}
.main-navigation > ul {
	position: relative;
	@include clearfixAfter();
}
.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation li {
	float: left;
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}


@include for-screen( phone-min ) {
	// Apply for desktop only
	#primary-menu > li > a {
		font-weight: bold;
		text-transform: uppercase;
	}
	.main-navigation ul ul {
		float: left;
		position: absolute;
		top: 1.5em;
		left: -999em;
		z-index: 999;
	}

	.main-navigation ul ul ul {
		left: -999em;
		top: 0;
	}

	.main-navigation ul ul a {
		width: $submmenu_nav_width;
	}

	.main-navigation ul li:hover > ul,
	.main-navigation ul li.focus > ul {
		left: auto;
	}

	.main-navigation ul ul li:hover > ul,
	.main-navigation ul ul li.focus > ul {
		left: 100%;
	}
}



.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
	color: $primary_hover;
}

.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

.main-navigation ul {
	display: block;
}


.main-navigation {
	//float: left;
	//position: relative;
	.child-toggle {
		display: none;
	}
	.menu-toggle {
		padding: 0px 18px;
		vertical-align: middle;
		.icon {
			margin-right: 10px;
		}
		.label {
			text-transform: uppercase;
			font-weight: bold;
		}
		@include rem( 'line-height', $header_line_height );
		@include for-screen( phone-max ) {
			@include rem( 'line-height', $header_line_mobile_height );
			@include rem( 'font-size', 16px );
		}
		@include for-screen( small-phone-max ) {
			@include rem( 'font-size', 22px );
			.icon {
				margin-right: 0px;
			}
			.label {
				display: none;
			}

		}
		@include rem( 'font-size', 28px );
		color: $header_link_color;
		border-right: 1px solid #f1f1f1;
		&:hover {
			color: $primary_hover;
		}

		&.hide-label {
			.icon {
				margin-right: 0px;
			}
			.label {
				display: none;
			}
		}
		@include for-screen( phone-min ) {
			display: none;
		}
		@include for-screen( phone-max ) {
			display: block;
		}
	}
	.primary-menu-wrapper {
		@include for-screen( phone-min ) {
			display: block;
		}
		@include for-screen( phone-max ) {
			display: none;

			position: absolute;
			top: 100%;
			left: 0px;
			width: 100%;
			background: #fff;
			z-index: 35;
			@include box-shadow();
			a {
				border-bottom: 1px solid #ededed;
			}
			li {
				display: block;
				float: none;
				position: relative;
				a {
					@include rem( 'line-height', 30px );
					padding: 5px 15px;
					display: block;
					> a {
						background: #ededed;
					}
				}
				.child-toggle {
					cursor: pointer;
					position: absolute;
					display: block;
					top: 10px;
					right: 15px;
					&::before {
						@include font-icon('"\\f067"');
					}
				}
				ul {
					display: block;
					float: none;
					max-height: 0px;
					position: relative;
					overflow: hidden;
					@include transition( all .5s ease-in-out );
					a {
						padding-left: 30px;
					}
					ul {
						a {
							padding-left: 60px;
						}
						ul {
							a {
								padding-left: 90px;
							}
						}
					}
				}
				&.child-open {
					> .child-toggle {
						&::before {
							@include font-icon('"\\f068"');
						}
					}
					> ul {
						max-height: 9999999px;
						overflow: auto;

					}
				}
			}

			&.menu-open {
				display: block;
			} // end mobile menu when open

		}

	}
	&.no-js {
		height: $header_line_height;
		@include for-screen( phone-max ) {
			@include rem( 'height', $header_line_mobile_height );
			max-width: 999999px;
			float: left;
		}
		overflow: hidden;
		display: inline-block;
		max-width: 30%;
	}

	@include for-screen( phone-min ) {
		#primary-menu {
			> li {
				&.menu-item-has-children {
					&:after {
						content: "";
						width: 16px;
						height: 16px;
						display: block;
						border: 1px solid #ededed;
						border-bottom: 0px none;
						border-right: 0px none;
						background: #fff;
						position: absolute;
						bottom: -8px;
						left: 50%;
						margin-left: -8px;
						transform: rotate(45deg);
						z-index: 999;
						visibility: hidden;
					}
					&:hover {
						&::after {
							visibility: visible;
						}
					}
				}
				li {
					z-index: 9999;
					position: relative;
				}


				/* Simple Mega Menu Support */

				@for $i from 2 through 4 {
				    &.mega-#{$i} {
				        > ul {
				            @include clearfixAfter();
							width: $submmenu_nav_width * 2;
							> li {
								width: percentage( ( 12 /$i ) / 12  );
								> a {
									font-weight: bold;
								}
								&.menu-item-has-children {
									//border: 1px solid #ededed;
								}

								&:nth-child(#{$i}n+1) {
				                	clear: left;
				                }

								li {
									width: 100%;
								}

							}
							a {
								border: 0px none;
								width: 100%;
								display: block;
							}
							ul {
								//margin-left: 15px;
								border: 0px none;
								display: block;
								position: relative;
								left: auto;
								right: auto;
								top: auto;
							}

				            /*
				            &:nth-child(#{$i}n+1) {
				                clear: left;
				            }
				            */
				        }
				    }
				}

				// ENd mega menu

			}
		}
		li {
			a {
				padding: 0px 15px;
				@include rem( 'line-height', $header_line_height );
				@include for-screen( phone-max ) {
					@include rem( 'line-height', $header_line_mobile_height );
				}
				color: $header_link_color;
				&:hover {
					color: $primary_hover;
				}
			}
			ul {
				top: 100%;
				background: #fff;
				border: 1px solid #ededed;
				//padding: 10px 0px;
				ul {
				//	padding: 0px 0px;
				}
			}

			li {
				position: relative;
				margin-bottom: -1px;
				a {
					@include rem( 'line-height', 30px );
					padding: 8px 15px;
					display: block;
					border-top: 1px solid transparent;
					border-bottom: 1px solid transparent;
					&:hover {
						border-color: #ededed;
					}
				}

				&:last-child {
					> a {
						border-bottom: 0px none;
					}
				}

				&:first-child {
					> a {
						border-top: 0px none;
					}
				}

				ul {
					display: none;
					position: absolute;
					left: 100%;
					top: -1px;
				}
				&:hover {
					> ul {
						display: block;
					}
				}
			}

			&.nav-more {
				&:hover {
					> ul {
						left: auto;
						right: 0px;
					}
				}

				> a {
					min-width: 50px;
					display: inline-block;
				}
			}
		} // end mneu li
	}
}


.right-navigation {
	float: right;
	text-align: right;
}
.primary-menu-wrapper {
	.right-navigation {
		position: relative;
		top: auto;
		left: auto;
		float: none;
		text-align: center;
		padding: 30px 0px;
		border-bottom: 1px solid #ededed;
		a {
			border-bottom: 0px;
		}
		.header-shop__icon {
			position: initial;
		}
		.header-dropdown {
			max-width: 100%;
			width: 100%;
			padding: 0px;
			right: 0px;
			left: 0px;
			.header-dropdown-inner {
				padding: 15px;
			}
		}
	}


}

/* Home sidebar */
.home-content-sidebar {
	.widget-title {
		@include rem( 'font-size', 18px );
		@include rem( 'line-height', 50px );
		margin: 0px;
		text-transform: uppercase;
	}
	.widget {
		&.container {
			padding-left: 0px;
			padding-right: 0px;
		}
		&.full-width {
			background: #fff;
			width: 100vw;
			position: relative;
			left: 50%;
			right: 50%;
			margin-left: -50vw;
			margin-right: -50vw;
			margin-bottom: 0px;
			padding-top: 40px;
			padding-bottom: 40px;
		}
		margin-top: 40px;
		margin-bottom: 40px;
		&:last-child {
			//margin-bottom: 0px;
		}
	}
}


/* Grid Products */
.grid-products {
	background: #fff;
	padding-left: 10px;
	padding-right: 10px;
	@include for-screen( phone-max ) {
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 5px;
		padding-right: 5px;
	}
	&.style-no-bg {
		background: none;
		padding-left: 0px;
		padding-right: 0px;
		.products {
			margin-left: -10px;
			margin-right: -10px;
		}
	}
	.products {

	}
}

/* Blog Widget */
.blog-posts {
	margin-left: -10px;
	margin-right: -10px;
	.eq-col {
		padding: 0px 10px;
	}
	.loop-post {
		padding-bottom: 0px;
		border-bottom: 0px;
		.enter-thumbnail {
			width: 100%;
			float: none;
			padding-right: 0px;
			margin-bottom: 20px;
		}
		.enter-content-w {
			width: 100%;
			float: none;
			padding-right: 0px;
		}
		.entry-title {
			@include rem ( font-size, 18px );
			@include rem ( height, 40px );
			display: block;
		}
	}

}



/* Tabs */
.layout-tabs {
	$tab_heading_width: 250px;
	background: #fff;
	//border: 1px solid $border;
	&.loading {
		overflow: hidden;
		display: block;
		position: relative;
		.tabs-layout-content {
			opacity: .5;
		}
		.tabs-layout-contents {
			position: relative;
			float: left;
			overflow: hidden;
			width: 100%;
		}
		.tab-loading {
			position: absolute;
			top: 0px; left: 0px;
			right: 0px; bottom: 0px;
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
	.widget-title {
		@include clearfixAfter();
		background: #fff;

		//flex-grow: 2;
		@include rem( 'font-size', 18px );
		@include rem( 'line-height', 50px );
		padding: 0px 15px;
		margin: 0px;
		text-transform: uppercase;
		float: left;
	}
	.filter-inside {
		@include clearfixAfter();
		border-bottom: 1px solid $border;
		position: relative;
	}
	.tab-item-actions {
		text-align: right;
		position: absolute;
		top: 0px;
		right: 10px;
		span {
			cursor: pointer;
			padding: 10px 5px 0px;
			font-size: 28px;
		}
	}

	.nav-tabs-filter {
		margin: 0px;
		padding: 0px;
		float: left;
		li {
			display: inline-block;
			list-style: none;
			position: relative;
			@include rem( 'line-height', 50px );
			&.active {
				a {
					color: $primary_hover;
				}
			}
			&.subfilter-more {
				ul {
					margin-left: 0px;
					padding: 0px;
					position: absolute;
					top: 100%;
					right: 0px;
					@include transition( all .5s ease-in-out );
					background: #fff;
					z-index: 55;
					max-height: 0;
					visibility: hidden;
					overflow: hidden;
					li {
						width: 100%;
						display: block;
						text-align: left;
						a {
							display: block;
						}
					}
				}

				&:hover {
					ul {
						z-index: 55;
						max-height: 999999px;
						visibility: visible;
					}
				}
			}

		}
		a {
			padding: 0px 15px;
			display: inline-block;
			color: $text;
			outline: none !important;
			&:hover {
				color: $primary_hover;
			}
		}
		display: inline-block;

	}

	.tabs-layout-contents {
		//display: flex;
		//flex-grow: 1;
		@include clearfixAfter();
	}
	.tabs-content-items, .tabs-item-inside, .type-product {
		//display: block;
	//	height: 100%;
	}
	.tabs-intro {
		width: $tab_heading_width;
		float: left;
		img {
			width: 100%;
			height: auto;
			max-width: 100%;
		}
	}

	.tabs-layout-content {
		display: block;

	}

	&.has-b {
		.tabs-layout-content {
			margin-left: $tab_heading_width;
		}
	}

	.tabs-item-inside {
		float: left;
	}
	.tabs-layout-contents {
		background: #fff;
		padding: 15px 10px;
	}
	.tabs-content-items {
		display: block;
		width: 100%;

		margin-left: 0px;
		margin-right: 0px;
	}
	.tabs-item-inside {
		padding: 0px;
		background: #fff;
		margin: 0px 10px;
	}
	.woocommerce-loop-product__title {
		@include rem( 'font-size', 16px );
	}



}

/* For brand Tabs */
.widget_sshop_products_brand {
	.layout-tabs {
		.tabs-intro {

			@include for-screen( phone-min ) {
				width: 40%;
			};

			@include for-screen( phone-max ) {
				width: 100%;
				.brand-logo {
					float: left;
					margin-right: 10px;
				}
			};

			@inlcude clearfixAfter();
			float: left;
			position: relative;
			z-index: 6;
			padding: 15px;
			img {
				width: auto;
				max-width: 150px;
				height: auto;
				max-width: 100%;
			}
		}
	}
	@include for-screen( phone-max ) {
		.tabs-layout-content  {
			clear: both;
		}
	};

	.btn-shop-brand {
		display: inline-block;
		margin-top: 15px;
	}
}

/* Widget category */
.widget-shop-categories {
	a {
		&:hover {
			text-decoration: none;
		}
	}
	ul {
		padding: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
		li {
			list-style: none;
		}
	}
	ul.list-shop-cats{
		margin-top: -15px;
		margin-bottom: -15px;
		@include clearfixAfter();
		> li {
			list-style: none;
			padding: 15px;
		}
	}
	.child {
		margin: 0px;
		padding: 0px;
		@include rem( margin, 15px 0px 0px 15px );
		li {
			> a {

				&::before{
					@include font-icon( '"\\f105"' );
					font-size: 80%;
					@include rem( margin-right, 7px );
				}
			}
		}
	}
	.cat-name {
		display: block;
		font-weight: bold;
		@include rem( margin-bottom, 10px );
	}
	.cat-link {
		font-weight: normal;
		color: $text;
		text-transform: uppercase;
		@include rem( font-size, 12px );
		border-bottom: 2px solid $text;
		padding: 5px 0px;
		display: inline-block;
		margin-bottom: 10px;
		z-index: 4;
		position: relative;
	}
	.top-p-cat {
		padding-top: 60%;
		display: block;
		background-color: #fff;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		position: relative;
		@include transition( all 1s ease-in-out );
		.inner {
			position: absolute;
			bottom: 0px;
			left: 0px;
			width: 100%;
			display: block;
			@include rem( padding, 15px );
			max-height: 100%;
			overflow: hidden;
		}

		&.has-image {
			//color: #fff;

			.cat-link {
			//	color: #fff;
			}
			&::before {
				background: rgba( 0, 0, 0, .20 );
				content: " ";
				display: block;
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0px;
				left: 0px;
				z-index: 1;
			}
		}
		a, span {
			position: relative;
			z-index: 3;
		}
		&:after {
			background-color: rgba( 255, 255, 255, .4 );
			content: "";
			display: block;
			height: 100%;
			width: 100%;
			position: absolute;
			top: 0px;
			left: 0px;
			z-index: 1;
		}

	}
}



/* Service icon */
.services-wrapper {
	.service-item {
		@include clearfixAfter();
		position: relative;

	}
	.icon {
		@include rem( font-size, 44px );
		position: absolute;
		left: 15px;
	}
	.info {
		//float: left;
		@include rem( padding, 13px 0px 10px );
		@include rem( margin-left , 50px );
		.service-title {
			@include rem( font-size, 16px );
			color: $text;
			font-weight: bold;
			a {
				color: inherit;
			}
			margin: 0px;
			padding: 0px;
			text-transform: uppercase;
		}
		span {
			color: $meta;
		}

	}
}



/* Sidebar */
.widget-area {
	color: #999999;
	ul, ol {
		margin: 0px;
		padding: 0px;
		ul, ol {
			padding-left: 30px;
		}
		li {
			list-style: none;
			margin-bottom: 15px;
			&:last-child {
				margin-bottom: 0px;
			}
		}
	}
}
.widgettitle, .widget-title {
	@include rem( 'font-size', 18px );
	@include rem( 'line-height', 50px );
	text-transform: uppercase;
}

.widget_categories,
.widget_archive,
.widget_pages,
.widget_recent_comments,
.widget_nav_menu,
.widget_tag_cloud,
.widget_meta,
.widget_recent_entries,
.widget.woocommerce {
	a {
		color: #666;
		&:hover {
			color: $primary_hover;
		}

	}
	.star-rating {
		color: $primary;
	}
}


.search-form {
	position: relative;
	border-radius: 5px;
	.search-field {
		width: 100%;
		max-width: 100%;
		@include rem(line-height, 40px );
		padding: 0px 0px 0px 40px;
	}
	&:before {
		@include font-icon( '"\\f002"' );
		position: absolute;
		top: 2px;
		left: 10px;
		color: #ccc;
		@include rem(font-size, 24px );
	}
	label {
		display: block;
	}
	.search-submit {
		display: none;
	}
}

/* Loop posts */

.loop-post {
	@include clearfixAfter();
	border-bottom: 1px solid #ededed;
	padding-bottom: 15px;
	margin-bottom: 20px;
	.entry-excerpt {
		p {
			margin-bottom: 0px;
		}
	}
	&.sticky {
		background-color: #fcf8e3;
		border: 1px solid #faf2cc;
		padding: 15px;
	}

	.enter-thumbnail {
		width: 40%;
		@include for-screen( phone-min ) {
			width: 40%;
			float: left;
			padding-right: 20px;
		}

		@include for-screen( phone-max ) {
			width: 100%;
			margin-bottom: 15px;
		}

		display: block;

		img {
			width: 100%;
			height: auto;
			max-width: 100%;
		}
	}
	.enter-content-w {
		@include for-screen( phone-min ) {
			width: 60%;
			float: left;
		}


	}
	&.no-thumbnail {
		.enter-content-w {
			width: 100%;
			float: none;
		}
	}
	.entry-meta {
		margin: 12px 0px;
	}
	.entry-title {
		color: $text;
		@include rem( 'font-size', 18px );
		a {
			color: $text;
			&:hover {
				color: $primary_hover;
			}
		}
	}
	.entry-more-btn {
		display: inline-block;
		margin-top: 15px;
		text-transform: uppercase;
		@include rem( font-size, 12px );
        border-radius: 0.1875rem;
        padding: 5px 15px;
        background-color: $primary;
        color: #FFFFFF;
        -webkit-appearance: none;
        &:hover {
            background: $primary_hover;
        }
	}
}
.entry-meta {
	@include rem( font-size, 12px );
	a {
		color: $text;
		&:hover {
			color: $primary_hover;
		}
	}
	> span {
		.fa {
			margin-right: 5px;
		}
		text-transform: uppercase;
		font-weight: bold;
		margin-right: 10px;
		&:last-child {
			margin-right: 0px;
		}
	}
}

/* Paging */
.post-navigation {
	padding-top: 20px;
	display: block;
	.nav-links {
		@include clearfixAfter();
		span, a {
			display: inline-block;
			padding: 5px 15px;
			@include rem( font-size, 18px );
			border: 1px solid #ededed;
			color: $text;
		}
		.nav-previous {
			padding-right: 10px;
		}
		.nav-next {
			padding-left: 15px;
		}
	}
}

.pagination {
	.nav-links {
		span, a {
			display: inline-block;
			padding: 5px 15px;
			@include rem( font-size, 18px );
			text-align: center;
			border: 1px solid #ededed;
			color: $text;
			margin-right: 5px;
		}
		a {
			background: #fff;
		}
		span {
			background: #ededed;
		}
	}
}

/* Single Post */
.single {
	.entry-title {
		margin-top: 0px;
		@include rem( font-size, 28px );
	}
	.entry-thumbnail {
		img {
			width: 100%;
			height: auto;
		}
		margin-top: 15px;
		margin-bottom: 15px;
	}
}
.entry-footer {
	display: block;
	margin-top: 15px;
	.cat-links, .tags-links {
		display: block;
	}
}


/* Comment */
#comments {
	margin-top: 30px;
}
.comment-list {
	padding: 0px;
	li {
		list-style: none;
		position: relative;

		.comment-body {
			margin-bottom: 15px;
		}
		&:last-child {
			.comment-body {
				margin-bottom: 15px;
			}
		}
		&.comment {
			display: block;
			border: 1px solid #ededed;
			&.parent.depth-1 {
				border-left-width: 2px;
			}
			margin-bottom: 15px;
			#respond {
				margin-top: 15px;
			}
			&.depth-2 {

			}

			&.depth-3 {

			}
			.children {
				li {
					border: 0px none;
				}
				margin-left: 0px;
				margin-top: 15px;
				margin-left: 50px;
				padding-left: 10px;
				border-left: 2px solid #ededed;
				.comment-body {
					margin-left: -1px;
					border: 0px none;
					//padding-top: 0px;
					//border-bottom: 1px solid #ededed;
				}
			}
		}

		.comment-meta {
			display: block;
			//float: left;
			width: 100%;
			color: $text;
			a {
				color: inherit;
			}
			.avatar {
				display: block;
				float: left;
				width: 50px;
				height: auto;
				margin-right: 15px;
			}
			.commentmetadata {
				padding-top: 0px;
				display: block;
				a {
					display: block;
				}
			}

			.comment-date {
				display: inline-block;
				font-style: italic;
				color: #666;
			}
			.fn {
				font-weight: bold;
			}
			@include clearfixAfter();
			border-bottom: 1px solid #ededed;
			padding-bottom: 10px;

		}
		.comment-body {
			padding: 10px;
			margin-bottom: 0px;
		}

		.comment-text {
			padding-top: 15px;
		}

		&.parent {
			.comment-text {
				border-bottom: 1px solid #ededed;
			}
		}
		.reply {
			margin-bottom: 10px;
			a {
				color: $text;
			}
		}
		.comment-content {
			display: block;
		}




	}
	ul, ol {
		padding-left: 0px;
		ul, ol {
			padding-left: 30px;
		}
	}
	.comment-edit-link {
		margin-left: 15px;
	}
}

/* Commment form */
#reply-title, .comments-title {
	@include rem( font-size, 22px );
	//text-transform: uppercase;
}
.comments-title {
	margin-bottom: 15px;
}
#commentform {
	.logged-in-as {
		padding: 10px 15px;
		background: #FCF8E3;
		margin: 5px 0px;
	}
	.required {
		color: red;
	}
	label {
		display: block;
	}
}





/* Footer */
.footer-widgets {
	padding: 60px 0px;
	background: #111111;
	color: #999999;
	a {
		color: #999999;
	}
	@include for-screen( phone-max ) {
		.row {
			display: block;
		}
	}
	.widget {
		margin-bottom: 0px;
		@include for-screen( phone-max ) {
			width: 100%;
		}
		.widget-title {
			@include rem( font-size, 16px );
			@include rem( margin-bottom , 15px );
			text-transform: uppercase;
		}
		ul {
			padding: 0px;
			margin: 0px;
			li {
				list-style: none;
				padding: 5px 0px;
				ul {
					margin-left: 30px;
				}
			}
		}
	}
}
.address, .email, .phone {
	margin: 5px 0px;
	&::before {
		width: 20px;
		display: inline-block;
	}
}
.address {
	&::before {
		@include font-icon( '"\\f041"' );
	}
}
.email {
	&::before {
		@include font-icon( '"\\f003"' );
	}
}
.phone {
	&::before {
		@include font-icon( '"\\f095"' );
	}
}
.site-footer {
	@include rem( font-size, 14px );
	padding: 15px 0px;
	background: #222222;
	color: #999999;
	a {
		color: #999999;
	}
}
