AnonymousFox

/home/develito/httpdocs/templates/jsn_epic2_pro/scss/joomla/_layout.scss

// ======================================
// ------------ GENARAL -----------------
// ======================================

$page-border: none !default;

$page-box-shadow: none !default;

html {
	position: relative;
	min-height: 100%;
}

body {
	height: 100%;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	a {
		transition: all 0.3s ease-in-out;
	}
}
.sw-header {
	position: relative;
	z-index: 999;
}
.content-center {
	text-align: center;
	margin-top: 10px;
}
// Row Flex
.sunfw-flex {
    display: -webkit-flex !important;
    display: flex !important;
    flex-wrap: wrap;        
    &.flex-items-middle {
        align-items: center;
        -webkit-align-items: center;
    }
    &.flex-items-top {
        align-items: top;
        -webkit-align-items: top;
    }
    &.flex-items-bottom {
        align-items: bottom;
        -webkit-align-items: bottom;
    }
    &.flex-items-right{
    	justify-content: flex-end;
    }
    //fix for safari
    &:before, &:after{
    	display: none;
    }
}

#{$brand-prefix}content {
	height: 100%;
	@include transition(all .3s);
}

img {
	max-width: 100%;
}
.sunfw-scrollup {
	background-color: #000;
	display: none;
	position: fixed;
	bottom: 0;
	right: 0;
	color: #999;
	z-index: 10000;
	padding: 8px 12px;
	transition: color 0.3s linear, background 0.3s ease-in-out;
	-moz-transition: color 0.3s linear, background 0.3s ease-in-out;
	-webkit-transition: color 0.3s linear, background 0.3s ease-in-out;
	text-align: center;
	i {
		font-size: 12px;
	}
	&:hover {
		text-decoration: none;
		color: #fff;
	}
	&.position-center {
		left: 50%;
	 	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	    transform: translateX(-50%);   
		bottom: 0;
		right: auto;
	}
	&.position-left {
		left: 30px;
		right: auto;
	}
}
.sunfw-switcher a.btn{
	padding: 5px 10px;
	margin-bottom: 1px;
	color: #fff;
	border-radius: 0;
	&.active,&:active{
		box-shadow: none;
		border-bottom: 1px solid #000;
	}
}
.chzn-container-single {
    .chzn-single {
		height: 35px;
		border-radius: 0;
		line-height: 35px;
		padding-left: 8px;
		padding-right: 8px;
	}
}
fieldset {
	margin-bottom: 20px;
}
.sample-module {
	margin-top: 20px;
}
#mailto-window {
	padding: 1px 20px;
}
/* ---------- Search Page ----------- */
form#searchForm{
	border: none;
	padding: 0;
	.searchintro{margin: 15px 0 0;}
	button .icon-search {
		@include rtl-margin-right(5px);
	}
	fieldset{
		margin-top: 10px;
		border-bottom: 2px dotted #d3d3d3;
		padding-bottom: 16px;
		margin-bottom: 15px;
		+ fieldset.only {
			margin-top: -3px;
		}
		legend{
			padding-bottom: 0;
			margin-bottom: 0;
			padding-top: 0;
			border: none;
		}
		label.radio, label.checkbox {
			margin-top: 11px;
			margin-bottom: 11px;
		}
		label input{
			display: inline-block;
			position: inherit;
			margin: -3px 6px 0 0;
			vertical-align: middle;
		}
		.ordering-box {
			padding-top: 5px;
			label {
				font-weight: bold;
			}
		}
	}
	p.counter{ padding: 0;
    margin: 15px 0 0;
    font-weight: bold;}
	.chzn-container-single {
		display: block;
		margin: 5px 0 0;
	}
	label[for*="limit"] {
		font-weight: bold;
	}
}
.search-results {
	margin: 10px 0;
	padding: 0;
	dt.result-title{
		padding-top: 5px;
	}
	.result-category {
		margin: 5px 0 10px;
		span {
			font-size: 100%;
			color: rgba(0,0,0,0.5);
		}
	}
	.result-created {
		margin-bottom: 12px;
	}
	+ .pagination {
		justify-content: center;
		padding-bottom: 0;
	}
	li {
		list-style: none;
	}
	h4.result-title {
		font-size: 12px;
		margin-top: 5px;
		margin-bottom: 5px;
		+ .result-url {
			font-size: 100%;
			color: rgba(0,0,0,0.5);
		}
	}
}
.chzn-container-single .chzn-single {
    border-radius: 5px;
    box-shadow: none;
    background: transparent;
    border-color: #d5d6d8;
    height: 35px;
    line-height: 35px;
    background-color: #fff;
    background-image: none;
    box-shadow: inset 0 3px 4px 0 rgba(211, 211, 211, 0.5);
    border: solid 1px #d3d3d3;
	div b {
		margin: 5px 0;
	}
}
.chzn-container-single .chzn-single span{
	@include rtl-margin-right(0);
}

.sunfw-sticky.sunfw-sticky-open {
	background: #FFF;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	right: 0;
	z-index: 999;
	.sunfw-menu-head.navbar-default {
		margin-top: 0;
	}
}
.search {
	#searchForm .chzn-container-single-nosearch {
		min-width: 250px;
	}
}
#finder-search {
	button.btn {
		padding-bottom: 8px;
		padding-top: 8px;
		@include rtl-margin-left(3px);
		line-height: 1.4;
		vertical-align: top;
		+ a[href="#advancedSearch"] {
			line-height: 1.4;
			vertical-align: top;
		}
	}
	.finder-selects {
		margin: 0 0 18px;
		.control-label {
			margin-bottom: 8px;
		}
	}
	fieldset {
		margin-bottom: 0;
	}
	#advancedSearch {
		> hr {
			margin-top: 15px;
		}
		#search-query-explained {
			padding: 5px 0 10px;
			p {
				margin-bottom: 10px;
			}
		}
		#finder-filter-window {
			.field-calendar {
				margin-top: 10px;
			}
			.chzn-container {
				min-width: 250px;
			}
		}
	}
}
.finder #search-results {
	#search-query-explained {
		padding: 15px 0 0;
	}
	ul.search-results {
		margin: 2px 0 5px;
	}
	.result-url {
		font-size: 100%;
		color: rgba(0,0,0,0.5);
	}
	.pagination {
		padding: 5px 0;
	}
	p.result-text {
		margin-bottom: 7px;
	}
}
div#finder-filter-window .filter-branch .finder-selects {
	float: none;
}
/* ============ Top ============ */

/* ============ PROMO ============ */
#sunfw-master .homepage-slideshow {
	[id^="jsn-themeclassic-jsgallery"] {
	    display: block;
	    .galleria-info .galleria-info-text {
    	    padding: 17px 15px;
			.galleria-info-description {
				p:last-child {
					margin-bottom: 0;
				}
			}
	    }
		.galleria-image-nav-left, .galleria-image-nav-right {
			opacity: 1;
			filter: alpha(opacity = 100);
			background-image: transparent;
			width: 42px;
			height: 42px;
		}
		.galleria-container .galleria-image-nav {
			position: absolute;
			top: 50%;
			margin-top: -21px;
			width: 100%;
			height: 42px;
			left: 0;
		}
	}
}
.galleria-image-nav-right {
  text-align: center;
  background-color: rgba(0,0,0,0.8);
  border-radius: 5px;
  &:before {
    content: "\f105";
    font-family: FontAwesome;
    font-size: 20px;
    color: #FFF;
    line-height: 42px;
  }
}
.galleria-image-nav-left {
  text-align: center;
  background-color: rgba(0,0,0,0.8);
  border-radius: 5px;
  &:before {
    line-height: 42px;
    content: "\f104";
    font-family: FontAwesome;
    font-size: 20px;
    color: #FFF;
  }
}
#sunfw_section_content-top {
	background-image: linear-gradient(to top, #595959, #282828);
	box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15);
}
/* ============ MAINCONTENT ============ */
.sunfw-content.boxLayout {
    box-sizing: content-box;
}

/* ============ USER BLOCKS ============ */
.sunfw-flex-component {
	.user-1 {
		@include rtl-border-right(2px dotted #d3d3d3);
	}
	.user-1, .user-2 {
		position: relative;
		margin-bottom: 15px;
		&:after {
			content: " ";
			display: block;
			position: absolute;
			bottom: -15px;
			width: 100%;
			left: 0;
			border-bottom: 2px dotted #d3d3d3;
		}
		h3.box-title {
			margin-top: 0;
		}
	}
	.user-1, .user-3 {
		@include rtl-padding-left(0);
	}
	.user-2, .user-4 {
		@include rtl-padding-right(0);
	}
}
.sunfw-pos-content-inner {
	h3.box-title {
		margin-bottom: 0;
		padding-bottom: 0;
	}
}
.sunfw-direction-rtl .sunfw-flex-component .user-2, .sunfw-direction-rtl .sunfw-flex-component .user-4 {
	padding-left: 0;
    padding-right: 15px;
}
.main-content {
	overflow-x: hidden;
	> div > .row {
		display: flex;
		display: -webkit-flex; /* NEW */
		> div {
			display: flex;
			display: -webkit-flex; /* NEW */
		}
	}
}
.sunfw-pos-content-inner,
#system-message-container {
	display: block;
	clear: both;
}
.content-left,
.content-right {
	.module-style {
		margin-bottom: 15px;
	}
}
.content-left {
	background: #E5E5E5;
    box-shadow: inset -8px 0 8px -8px rgba(0,0,0,0.37);
	.module-style {
		&:first-child {
			.box-title {
				margin-top: 0;
			}
		}
	}
}
.content-right {
	background: #E5E5E5;
    box-shadow: inset 8px 0 8px -8px rgba(0, 0, 0, 0.37);
}
/* ---------- BOTTOM CONTENT ----------- */
.lightgrey-bg {
	background-image: linear-gradient(to bottom, #f4f4f4, #d9d9d9);
}
/* ---------- Article Category Blog ----------- */
.page-header {
	padding: 0;
	margin: 0;
	border-bottom: none;
	clear: both;
	h2 {
		margin: 0 0 3px;
		font-size: 15px;
		a {
			color: #000;
		}
	}
}
.sunfw-homepage .page-header {
	margin-top: 15px;
	h2 {
		margin-top: 1px;
		margin-bottom: -1px;
	}
}
div.icons {
	margin: -23px 0px 27px;
	.dropdown-menu > li {
		padding-top: 0;
		padding-bottom: 0;
		> a {
			padding: 5px 15px;
			font-size: 12px;
		}
	}
}
.article-info[class*="mut"] {
    margin: 4px -5px 0;
	color: rgba(0,0,0,0.4);
	+ .articleBody {
		margin-top: 10px;
	}
	dd {
		display: inline-block;
		padding: 0 5px;
		line-height: 22px;
		margin: 0;
		&:first-child {
			@include rtl-padding-right(0);
		}
		i.fa {
			@include rtl-margin-right(1px);
		}
	}
	+ .content_rating + form {
		margin-bottom: 20px;
	}
}
.sunfw-homepage .article-info[class*="mut"] {
    margin-bottom: 12px;
}
.blog-featured .entry-content, .blog .entry-content {
	margin-top: 10px;
}
.icons {
	.btn-group {
		.btn.dropdown-toggle {
			background-image: linear-gradient(to bottom, #ffffff, #d9d9d9);
			border: solid 1px #999999;
			border-radius: 5px;
			padding: 3px 16px;
			color: #000;
			.caret {
				@include rtl-margin-left(5px);
			}
		}
		&.open {
			.btn.dropdown-toggle {
				box-shadow: none;
			}
		}
	}
}
ul.pagenav {
	border-top: 2px dotted #d3d3d3;
    padding-top: 15px;
    margin-top: 16px;
}
.layout-item {
	.items-leading {
		[class*="leading-"] {
			margin-bottom: 15px;
			border-bottom: 2px dotted #d3d3d3;
			padding-bottom: 2px;
			overflow: hidden;
		}
	}
	.items-row {
		margin-bottom: 13px;
		overflow: hidden;
		position: relative;
		> [class*="col-"] {
			&:after {
				content: '';
				width: 2px;
				height: calc(100% - 15px);
				position: absolute;
				border-right: 2px dotted #d3d3d3;
				top: 0;
				@include rtl-right(0);
			}
			padding-bottom: 4px;
			&:last-child {
				&:after {
					display: none;
				}
			}
		}
		&:after {
			content: '';
			width: calc(100% - 30px);
			position: absolute;
			border-top: 2px dotted #d3d3d3;
			@include rtl-right(0);
			@include rtl-left(15px);
			bottom: 0;
		}
		&:last-child {
			&:after {
				display: none;
			}
		}
	}
}
.items-more {
    margin: 15px 0 0;
    clear: both;
	.nav-tabs {
		border-color: #E7EAEE;
		border-style: dotted;
		border-width: 0 0 2px;
		> li {
			> a {
				padding: 0 0 13px;
				margin: 0;
				border: none;
				color: #394A5C;
				&:hover {
					background: transparent;
				}
			}
		}
	}
}
.content_rating {
    display: flex;
    align-items: center;
	padding: 2px 0px 16px;
    justify-content: flex-end;
	@include rtl-float-right();
	p {
		margin: 0;
		@include rtl-margin-right(10px);
	}
	+ form {
		input[name="submit_vote"] {
		}
		.content_vote {
			display: flex;
			align-content: center;
			align-items: center;
			label {
				@include rtl-margin-right(5px);
			}
		}
	}
}
.blog-featured,
.blog {
	.item-image {
		margin-bottom: 13px;
		margin-top: 10px;
		&.pull-left {
			@include rtl-margin-right(15px);
		}
		&.pull-right {
			@include rtl-margin-left(15px);
		}
	}
	.pull-none + .entry-content {
		clear: both;
	}
	h2.item-title {
		margin-top: 0;
		margin-bottom: 4px;
		font-size: 14px;
		a {
			color: #000;
		}
	}
	.pagination {
		margin: 0 auto;
		justify-content: center;
		padding: 2px 0 0;
		border-top: 0;
	}
}
.readmore {
	margin: 0;
	@include rtl-float-left();
}
/* ---------- Article Category List ----------- */
.content-category {
	margin-top: 15px;
	img {
		border: solid 1px #d3d3d3;
		padding: 2px;
	}
	.page-header {
		padding-top: 15px;
		padding-bottom: 2px;
	}
	.category-desc {
		+ form {
			fieldset.btn-toolbar {
				margin-bottom: 16px;
				margin-top: 16px;
				border-top: 2px dotted #d3d3d3;
				padding-top: 16px;
				margin-left: 0;
				label {
					@include rtl-margin-right(5px);
				}
			}
			table {
				td[headers="categorylist_header_date"] {
					font-size: 100%;
				}
			}
		}
	}
	.cat-children {
		h3.page-header {
			padding: 0 0 13px;
			border-bottom: 2px dotted #d3d3d3;
			margin-bottom: 14px;
			margin-top: 14px;
		}
		h1 {
			margin-top: 0;
		}
	}
}
.category-list {
	.cat-children {
		border-top: 2px dotted #d3d3d3;
		padding-top: 13px;
	}
}
.badge {
    padding: 0;
    font-weight: normal;
    color: #000;
    background: transparent;
}
/* ---------- Article Categories ----------- */
.categories-list {
	.page-header {
		margin-bottom: 10px;
	}
	div:not(.base-desc) {
		margin: 16px 0 0;
	}
	img {
		border: 1px solid #d3d3d3;
		padding: 2px;
	}
	.category-desc img {
		margin: 5px 0;
	}
}
.cat-children,
.categories-list {
	.item-title.page-header {
		padding-bottom: 14px;
		border-bottom: 2px dotted #d3d3d3;
		margin-bottom: 14px;
	}
	div.category-desc {
		margin: 12px 0;
		+ div.collapse {
			@include rtl-padding-left(30px);
		}
	}
	.last > div.category-desc {
		margin-bottom: 0px;
	}
	div[id^="category-"] .last div.category-desc p {
		margin-bottom: 0px;
	}
	.badge {
		border-radius: 11px;
		color: #fff;
		font-size: 10px;
		font-weight: normal;
		padding: 5px 20px;
		background-image: linear-gradient(to top, #244667, #2d5881);
		@include rtl-margin-left(20px);
	}
	a[data-toggle="collapse"] {
		padding: 0;
		border-radius: 5px;
		top: -4px;
		&:active {
			box-shadow: none;
		}
	}
	a {
		.icon-plus:after,
		.icon-minus:after {
			display: inline-block;
			font: normal normal normal 12px/1 FontAwesome;
			font-size: inherit;
			text-rendering: auto;
			width: 24px;
			height: 26px;
			background: linear-gradient(to bottom, #ffffff, #d9d9d9);
			color: #000;
			line-height: 26px;
			border-radius: 5px;
		}
		.icon-minus:after {
			content: "\f068";
		}
		.icon-plus:after {
			content: "\f067";
		}
		&[aria-expanded="true"] {
			.icon-plus:after {
				content: "\f068";
			}
		}
	}
}
.cat-children {
	> h3 {
		font-size: 20px;
		margin-top: 12px;
	}
}
/* ---------- Single Article ----------- */
button.btn:not(.ui-datepicker-trigger) {
	.icon-calendar {
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		&:after {
			content: "\f073";
			font-size: 14px;
		}
	}
}
.item-page {
	.item-image {
		margin-bottom: 15px;
		margin-top: 10px;
		&.pull-left {
			@include rtl-margin-right(15px);
		}
		&.pull-right {
			@include rtl-margin-left(15px);
		}
		&.pull-none + .articleBody {
			clear: both;
		}
	}
	.articleBody {
		p {
			margin-bottom: 15px;
		}
	}
	.article-index[class*="pull-"] + .articleBody {
		clear: none;
	}
	&.edit {
		#com-content-formTabs {
			> li {
				padding: 0;
				> a {
					border-width: 1px 1px 0;
					border-style: solid;
					border-color: #d3d3d3;
					color: #000;
					font-weight: bold;
					padding: 8px 16px;
					@include rtl-margin-right(-1px);
				}
				&.active {
					> a {
						background-image: linear-gradient(to bottom, #e9e9e9 4%, #ffffff);
						padding: 10px 16px;
						margin-top: -3px;
					}
				}
			}
		}
		#com-content-formContent {
			border-width: 0 1px 1px;
			border-style: solid;
			border-color: #d3d3d3;
			padding: 15px;
			&:after {
				clear: both;
				content: " ";
				display: table;
			}
		}
		#editor {
			> .control-group {
				.control-label {
					width: 8%;
					label {
						font-weight: bold;
					}
				}
			}
		}
		.control-group {
			margin: 0 0 15px;
			label {
				@include rtl-margin-right(10px);
				font-weight: bold;
			}
		}
		
		.js-editor-tinymce {
			.mce-edit-area {
				border-width: 1px 0 0 0 !important;
				border-color: #d5d6d8;
				border-radius: 5px;
			}
			.mce-panel {
				border-color: #d5d6d8;
				background-color: #f8f8f8;
			}
		}
		.sunfw-media-selector {
			border: 1px solid #d3d3d3;
			border-radius: 5px;
			input {
				border-width: 0 1px 0 0;
				border-style: solid;
				border-color: #d3d3d3;
				border-radius: 5px 0 0 5px;
				min-width: calc(320px - 36px) !important;
				background-color: #fff;
				+ .btn {
					padding: 9px 12px;
					vertical-align: top;
					background-image: linear-gradient(to top, #f1f1f1, #ffffff);
					box-shadow: inset 1px 0 0 0 #ffffff;
					border: none;
					border-radius: 0 5px 5px 0;
				}
			}
		}
		#attrib-sunfw-options {
			margin-bottom: 35px;
			@include rtl-float-left();
		}
		#com-content-formContent #images,
		#publishing {
			margin-bottom: 48px;
			.control-label {
				flex: 0 0 15%;
			}
			.chzn-container-multi .chzn-choices {
				border-color: #d3d3d3;
				box-shadow: inset 0 3px 4px 0 rgba(211, 211, 211, 0.5);
				border: solid 1px #d3d3d3;
				border-radius: 5px;
				height: 35px;
				li.search-field input[type="text"] {
					height: 30px;
				}
			}
			button.btn {
				padding: 8px 15px;
				vertical-align: top;
				line-height: 1.4;
			}
		}
		#publishing {
			.control-group {
				@include rtl-float-left();
				width: 50%;
				clear: none;
				&:last-child {
				width: 100%;
				float: none;
				clear: both;
				}
			}
		}
		#metadata {
			margin-bottom: 42px;
			.control-label {
				flex: 0 0 15%;
			}
			textarea {
				min-width: 100%;
			}
			.control-group {
				margin: 0 0 10px;
			}
		}
		#language {
		    margin-bottom: 48px;
			.control-group {
				margin-bottom: 10px;
			}
		}
		.chzn-container-multi .chzn-choices,
		select:not(.time), textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"],
		.chzn-container-single .chzn-single {
			min-width: 320px;
			background-color: #fff;
		}
		.chzn-container-single .chzn-search input[type="text"] {
			min-width: 100%;
		}
		.calendar-container table {
			max-width: 355px;
		}
		button.btn:not(.btn-primary) {
			background-image: linear-gradient(to bottom, #ffffff, #d9d9d9);
			border: solid 1px #999999;
			color: #000;
			padding: 8px 30px;
		}
		form#adminForm {
			position: relative;
			fieldset {
				margin-bottom: 0;
			}
			.toggle-editor .btn {
				margin: 15px 15px 0;
				background-image: linear-gradient(to bottom, #ffffff, #d9d9d9);
				border: solid 1px #999999;
				color: #000;
			}
			> .btn-toolbar {
				position: absolute;
				bottom: 15px;
				margin: 0 -6px;
				left: 15px;
			}
		}
	}
	.j2store-product-edit-form {
		background: transparent;
		padding: 0 0 50px;
		.panel {
			border-radius: 0;
			box-shadow: none;
		}
		> hr {
			display: none;
		}
	}
	#editor-xtd-buttons {
		margin: 0 -15px 60px;
		a.btn {
			padding: 15px 10px;
		}
	}
	.toggle-editor.btn-toolbar {
		@include rtl-margin-right(-14px);
	}
}
.edit #images .input-prepend.input-append {
    position: relative;
    display: inline-block;
}
.item-page.edit .input-append input[type="text"] + a + a.btn.hasTooltip {
    padding: 8px 10px;
    vertical-align: top;
    background: #fff;
    border-width: 1px;
    border-style: solid;
    border-color: #d3d3d3;
    height: 35px;
    margin: 0 5px;
	box-shadow: inset 0 3px 4px 0 rgba(211, 211, 211, 0.5);
	.icon-remove {
		display: inline-block;
		font: normal normal normal 12px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		&:before {
			content: "\f00d";
		}
	}
}
.edit #images .input-prepend.input-append .modal.btn {
    position: absolute;
    display: inline-block;
    z-index: 1;
    max-width: 90px;
    border: none;
    right: 45px;
    top: 0;
    left: auto;
    border-radius: 0;
    padding: 9px 15px;
    background: #fff;
    border: 1px solid #d3d3d3;
    border-right: 0;
	margin: 0 -3px;
	border-radius: 0 5px 5px 0;
    box-shadow: inset 0 3px 4px 0 rgba(211, 211, 211, 0.5);
}
.field-calendar {
	> .input-append {
		display: inline-flex;
		border: 1px solid #d3d3d3;
		border-radius: 5px;
		input[type="text"] {
			border-width: 0 1px 0 0;
			border-style: solid;
			border-color: #d3d3d3;
			border-radius: 5px 0 0 5px;
			min-width: calc(320px - 37px);
			+ button.btn {
				background-image: linear-gradient(to top, #f1f1f1, #ffffff);
				box-shadow: inset 1px 0 0 0 #ffffff;
				border: none;
				border-radius: 0 5px 5px 0;
				padding: 8px 12px !important;
			}
		}
	}
	+ input[type="button"] {
		padding: 8px 20px;
		color: #fff;
	}
}
/* ---------- Archive Article ----------- */
.archive {
	.filter-search {
		.btn {
			padding-bottom: 8px;
			padding-top: 8px;
		}
		> select {
			min-width: 80px;
		}
	}
	.article-info {
		margin-bottom: 8px;
	}
	.article-info-term {
		display: none;
	}
	> form > fieldset {
		padding-bottom: 5px;
		margin-bottom: 0;
	}
	.pagination {
		border: none;
	}
	#archive-items > [class*="row"] {
		border-bottom: 2px dotted #d3d3d3;
		margin-bottom: 16px;
	}
}
/* ---------- Administrator Components ----------- */
.article-index {
	.nav-tabs {
		border: 1px solid #d5d6d8;
		> li {
			> a {
				border-bottom: 1px solid #d5d6d8;
				border-width: 0 0 1px 0;
				border-radius: 0;
				margin: 0;
				color: #394a5c;
			}
			&.active {
				> a {
					&:hover, &:focus {
						border-width: 0 0 1px 0;
						border-radius: 0;
						background-color: #eee;
					}
				}
			}
		}
	}
	+ .articleBody {
		.pagenavcounter {
			margin-bottom: 10px;
			+ p {
				+ ul {
					padding-left: 15px;
					padding-right: 15px;
				}
			}
		}
	}
}
/* ---------- Tag Category ----------- */
.tag-category {
	form {
		fieldset {
			margin: 30px 0;
			button {
				padding: 8px 15px;
				&[name*="filter-"] i.fa {
					margin: 0;
				}
			}
			label.filter-search-lbl {
				display: block;
			}
			.form-group + .btn-group {
				margin-top: 27px;
			}
		}
	}
	> img {
		margin: 0 0 25px;
		display: block;
	}
	.category {
		padding: 0;
		li {
			list-style: none;
			h3 {
				margin-top: 0;
			}
			img {
				margin-bottom: 20px;
			}
		}
	}
	ul.thumbnails {
		padding: 0;
		li {
			list-style: none;
		}
	}
}
/* ---------- Comming Soon Page ----------- */
body {
	.full-height {
		height: 100vh;
	}
	.coming-soon {
		.search #mod-search-searchword + button {
			background-image: linear-gradient(to bottom, #3677ad, #2c5983);
		  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.2);
		  border: solid 1px #234768;
		}
	}
}
.jsn-counter-wrap {
	.info {
		.number {
			color: #394A5C;
			font-family: Roboto;
			font-size: 32px;
			font-weight: bold;
			line-height: 80px;
			text-align: center;
			border: 1px solid #D1D6DE;
			width: 80px;
			height: 80px;
			display: block;
			background: #fff;
		}
		.title {
			color: #394A5C;
			font-family: Roboto;
			font-size: 14px;
			line-height: 21px;
			text-align: center;
			margin-top: 20px;
			display: block;
		}
	}
}
/* ---------- Content Types ----------- */
.sunfw-link,
.sunfw-quote,
.sunfw-gallery,
.sunfw-video,
.sunfw-standard {
	margin-bottom: 13px;
	margin-top: 10px;
	img {
		border: 1px solid #d3d3d3;
		padding: 2px;
	}
	.carousel-control {
		margin: 3px;
	}
}
.item-image,
.sunfw-standard {
	img {
		border: 1px solid #d3d3d3;
		padding: 2px;
	}
}
.sunfw-link {
    border-radius: 5px;
    background-image: linear-gradient(to bottom, #3d3d3d, #010101);
    box-shadow: 0 0 5px 0 #dadada, inset 0 1px 0 0 rgba(255, 255, 255, 0.2);
    border: solid 1px #000000;
    padding: 18px 20px;
    @include rtl-text-align-left();
	h2 {
		margin: 0;
	}
	a {
		color: #fff;
		display: flex;
		align-content: center;
		align-items: center;
		font-size: 20px;
		i {
			font-size: 120px;
			line-height: inherit;
			background: transparent;
			width: 118px;
			height: 118px;
			@include rtl-margin-right(0);
			border-radius: 0;
			display: inline-block;
			float: none;
			position: relative;
			line-height: 125px;
			color: rgba(255,255,255,0.2);
			@include rtl-margin-right(-90px);
		}
	}
}
.sunfw-quote {
    background: #f5f5f5;
    border: none;
    padding: 40px 20px 1px;
    font-style: italic;
    background: #F5F5F5 url(../../jsn_epic2_pro/images/icons/quote.png) no-repeat 20px 20px;
    color: #424857;
	> i.fa-quote-left {
		display: none;
	}
	p {
		margin-bottom: 0;
	}
	.author {
		color: #394A5C;
		font-family: Roboto;
		font-size: 18px;
		font-weight: bold;
		line-height: 21px;
		font-style: normal;
		margin: 20px 0 0;
	}
}
/* ---------- Content Types ----------- */
#sunfw-social-share {
	a {
		display: inline-block;
		margin-left: 2px;
		margin-right: 2px;
		i.fa {
			font-size: 22px;
		}
	}
}
/* ---------- Other Pages ----------- */
div.sw-tab-layout {
	> nav {
		> a {
			border-radius: 5px 5px 0 0;
			background-color: #ffffff;
			border-width: 1px 1px 0;
			border-style: solid;
			border-color: #d3d3d3;
			margin: 0 -1px;
			padding: 7px 30px;
			transition: all 0.1s ease-in-out;
			&[data-active="true"] {
				background-image: linear-gradient(to bottom, #e9e9e9 4%, #ffffff);
				border-color: #d3d3d3;
				margin-top: -3px;
				margin-bottom: -1px;
				position: relative;
				z-index: 2;
				padding-top: 10px;
			}
		}
		+ [class*="_content"] {
			border: 1px solid #d3d3d3;
			padding: 15px;
			border-radius: 0 5px 5px;
			margin: 0 -1px;
		}
	}
}
.pb-countdown__inner [class*="pb-countdown"] {
	color: #fff;
	padding-left: 10px;
	padding-right: 10px;
	span {
		background-image: linear-gradient(to bottom, #3d3d3d, #010101);
		padding: 10px 12px;
		font-size: 36px;
		color: #fff;
		border-radius: 5px;
		position: relative;
		&:after {
			content:"";
			height: 1px;
			width: 100%;
			position: absolute;
			top: 50%;
			margin-top: -1px;
			@include rtl-left(0);
			background-color: #000000;
			box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2);
		}
	}
	label {
		text-transform: uppercase;
		font-family: Arial;
		font-size: 12px;
		margin-top: 12px;
	}
}
.jsn-uniform.jsn-master {
	.radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {
		position: static;
		vertical-align: middle;
		margin: 0 10px 0 0;
	}
	.form-actions {
		.btn:not([type="submit"]) {
			padding-top: 9px;
			padding-bottom: 9px;
		}
	}
	.jsn-form-content .control-group.ui-state-highlight {
		background: #fff;
	}
	.btn.ui-datepicker-trigger {
		padding: 9px 10px;
		@include rtl-margin-left(10px);
	}
	.jsn-bootstrap {
		.currency-value >div > .add-on {
			@include rtl-margin-right(10px);
		}
		input[type="file"] {
			height: 35px;
			line-height: 16px;
			box-shadow: inset 0 3px 4px 0 rgba(211, 211, 211, 0.5);
			border: solid 1px #d3d3d3;
			padding: 5px 6px;
		}
		.recaptchatable #recaptcha_response_field {
			height: auto;
		}
	}
}
.jsn-uniform.jsn-master .jsn-bootstrap select {
    height: 35px;
}
.jsn-uniform .row-fluid {
    margin: 0 0 10px;
}