/* Body
----------------------------------------------------------*/
* {
	box-sizing: border-box;
}

body {
	color: @text-color;
	font-size: @font-size;
	font-weight: @font-weight;
	font-style: @font-style;
	font-family: @font-family-primary;
	line-height: @line-height;
	background: @bg-color;
	overflow-x: hidden;
	word-wrap: break-word;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

:focus {
	outline: none;
}

/* Typography
----------------------------------------------------------*/
a {
	transition: 0.5s;
	color: @link-color;
	text-decoration: @link-decoration;

	&:hover {
		color: @link-color;
		text-decoration: @link-hover-decoration;
	}

	img {
		border: none;
		height: auto;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: @dark;
	font-weight: normal;
	font-family: @font-family-secondary;
	line-height: 1.2;
}

h1 {
	font-size: @font-size-h1;
}

h2 {
	font-size: @font-size-h2;
}

h3 {
	font-size: @font-size-h3;
}

h4 {
	font-size: @font-size-h4;
}

h5 {
	font-size: @font-size-h5;
}

h6 {
	font-size: @font-size-h6;
}

/* Elements
----------------------------------------------------------*/
img {
	max-width: 100%;
}

input[type=text],
textarea {
	border: 1px solid @border-primary;
	background-color: @bg-color;
	padding: 7px;
}

blockquote {
	font-style: italic;
	border-left: @primary-color;
	margin-left: 30px;
	margin-right: 30px;
	padding: 20px;
}

select {
	box-sizing: border-box;
	border: 1px solid #e7e7e7;
	color: #666;
	background-color: @light;
}

/* Layout
----------------------------------------------------------*/
.container {
	padding-left: 0;
	padding-right: 0;

	.container {
		padding-left: 15px;
		padding-right: 15px;
		width: 100%;
	}
}

.sidebar-content .content-area {
	float: right;
}

.site-content {
	padding: 40px 0 30px;
}
/* Clearfix
----------------------------------------------------------*/
.clearfix {
	zoom: 1;

	&:before,
	&:after{
		content: "";
		display: table;
	}

	&:after{
		clear: both;
	}
}

/* Tabs
----------------------------------------------------------*/
.tabs {
	@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
	@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
	@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

	.tabs-nav {
		margin: 0;
		padding: 0;
		overflow: hidden;
		list-style-type: none;

		li {
			float: left;
		}

		a {
			display: block;
		}
	}

	.tabs-panel {
		clear: both;
		display: none;

		&.active {
			animation: fadeIn 1 1s ease;
			display: block;
		}
	}
}

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding: 0;
    width: 20%;
    float: left;
}

.bb-col-9 {
    position: relative;
    min-height: 1px;
    padding: 0;
    width: 76% !important;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}

.bb-col-7 {
	position: relative;
    min-height: 1px;
    padding: 0;
    width: 54% !important;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}

.bb-col-6 {
	position: relative;
    min-height: 1px;
    padding: 0;
    width: 52% !important;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}

.bb-col-3 {
    position: relative;
    min-height: 1px;
    padding: 0;
    width: 24% !important;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}

.bb-col-2 {
    position: relative;
    min-height: 1px;
    padding: 0;
    width: 22% !important;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}


/**
 * Bootstrap modal
 */
.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1050;
	display: none;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	outline: 0;
	background: rgba(0,0,0,0.75);
}
.modal.fade .modal-dialog {
	-webkit-transition: -webkit-transform .3s ease-out;
	-o-transition: -o-transform .3s ease-out;
	transition: transform .3s ease-out;
	-webkit-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.modal.in .modal-dialog {
	-webkit-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.modal-open .modal {
	overflow-x: hidden;
	overflow-y: auto;
}
.modal-dialog {
	position: relative;
	width: auto;
	margin: 10px;
}
.modal-content {
	position: relative;
	background-color: #fff;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	outline: 0;
	border: none;
}
.modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1040;
	background-color: #000;
}
.modal-backdrop.fade {
	filter: alpha(opacity=0);
	opacity: 0;
}
.modal-backdrop.in {
	filter: alpha(opacity=50);
	opacity: .5;
}
.modal-header {
	min-height: 40px;
	text-align: center;
	position: absolute;
	z-index: 99;
	right: 0px;
	border: none;
	padding: 0;
}
.modal-header .close {
	height: 40px;
	width: 40px;
	color: #444444;
}
.modal-title {
	margin: 0;
	line-height: 1.42857143;
}
.modal-body {
	position: relative;
	min-height: 40px;
	padding: 20px;
}
.modal-footer {
	padding: 15px;
	text-align: right;
	border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
	margin-bottom: 0;
	margin-left: 5px;
}
.modal-footer .btn-group .btn + .btn {
	margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
	margin-left: 0;
}
.modal-scrollbar-measure {
	position: absolute;
	top: -9999px;
	width: 50px;
	height: 50px;
	overflow: scroll;
}
button.close {
	-webkit-appearance: none;
	padding: 0;
	cursor: pointer;
	background: transparent;
	border: 0;
	font-size: 21px;
}
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
@media (min-width: 768px) {
	.modal-dialog {
		width: 70%;
		margin:7.5% auto;
	}
	.modal-content {

	}
	.modal-sm {
		width: 300px;
	}
}
@media (min-width: 992px) {
	.modal-lg {
		width: 900px;
	}
}

/**
 * jQuery UI Auto Complete
 */
.ui-helper-hidden-accessible {
	display: none;
}
.ui-autocomplete-input {

}
.ui-autocomplete-loading {
	background: url(img/loading.gif) no-repeat 98% center;
	background-size: 16px;
}
.ui-autocomplete {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1000;
	float: left;
	display: none;
	min-width: 160px;
	max-height: 400px;
	overflow-y: auto;
	margin: 0;
	padding: 15px 0 0 0;
	list-style: none;
	background-color: @light;

	.ui-menu-item {
		transition: 0.3s;
		padding: 10px 15px;
		overflow: hidden;
		border-bottom: 1px solid @border-secondary;

		&:hover {
			background-color: @border-secondary;
		}

		a {
			display: block;
			font-weight: 700;

			&:hover {
				text-decoration: none;
			}
		}

		img {
			float: right;
			margin-left: 5px;
			width: 50px;
			height: auto;
		}

		.product-title {
			padding-bottom: 3px;
			display: block;
		}

		.star-rating {
			float: none;
			font-size: 12px;
		}

		.product-price {
			font-family: 'Montserrat', sans-serif;
			font-weight: 400;

			ins {
				text-decoration: none;
			}
		}
	}

	.ui-menu-item > a.ui-corner-all {
		display: block;
		padding: 3px 20px;
		clear: both;
		font-weight: normal;
		line-height: 18px;
		color: #555555;
		white-space: nowrap;

		&:hover,
		&.ui-state-hover,
		&.ui-state-active {
			cursor: pointer;
			text-decoration: none;
			background-color: #fff;
			background-image: none;
		}
		.highlight {
			font-weight: 700;
		}
	}
}
