// CSS Reset
@import "../../../media/jui/less/reset.less";

// Core variables and mixins
@import "variables.less"; // Custom for this template
@import "../../../media/jui/less/mixins.less";

// Grid system and page structure
@import "../../../media/jui/less/scaffolding.less";
@import "../../../media/jui/less/grid.less";
@import "../../../media/jui/less/layouts.less";

// Base CSS
@import "../../../media/jui/less/type.less";
@import "../../../media/jui/less/code.less";
@import "../../../media/jui/less/forms.less";
@import "../../../media/jui/less/tables.less";

// Components: common
// @import "../../../media/jui/less/sprites.less";
@import "../../../media/jui/less/dropdowns.less";
@import "../../../media/jui/less/wells.less";
@import "../../../media/jui/less/component-animations.less";
@import "../../../media/jui/less/close.less";

// Components: Buttons & Alerts
@import "../../../media/jui/less/buttons.less";
@import "../../../media/jui/less/button-groups.less";
@import "../../../media/jui/less/alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less

// Components: Nav
@import "../../../media/jui/less/navs.less";
@import "../../../media/jui/less/navbar.less";
@import "../../../media/jui/less/breadcrumbs.less";
@import "../../../media/jui/less/pagination.less";
@import "../../../media/jui/less/pager.less";

// Components: Popovers
@import "../../../media/jui/less/modals.less";
@import "../../../media/jui/less/tooltip.less";
@import "../../../media/jui/less/popovers.less";

// Components: Misc
@import "../../../media/jui/less/thumbnails.less";
@import "../../../media/jui/less/labels-badges.less";
@import "../../../media/jui/less/progress-bars.less";
@import "../../../media/jui/less/accordion.less";
@import "../../../media/jui/less/carousel.less";
@import "../../../media/jui/less/hero-unit.less";

// Utility classes
@import "../../../media/jui/less/utilities.less";

// RESPONSIVE CLASSES
// ------------------

@import "../../../media/jui/less/responsive-utilities.less";


// MEDIA QUERIES
// ------------------

// Phones to portrait tablets and narrow desktops
@import "../../../media/jui/less/responsive-767px-max.less";

// Tablets to regular desktops
@import "../../../media/jui/less/responsive-768px-979px.less";

// Large desktops
@import "../../../media/jui/less/responsive-1200px-min.less";


// RESPONSIVE NAVBAR
// ------------------

// From 979px and below, show a button to toggle navbar contents
@import "../../../media/jui/less/responsive-navbar.less";

// Extended for JUI
@import "../../../media/jui/less/bootstrap-extended.less"; // Has to be last to override when necessary
// div.modal (instead of .modal)
@import "../../../media/jui/less/modals.joomla.less";
@import "../../../media/jui/less/responsive-767px-max.joomla.less";

// Icon Font
@import "icomoon.less";

/* Site Body Styles */
body.site{
	border-top:3px solid #0088cc;
	padding: 20px;
	background-color: #f4f6f7;
}
body.site.fluid{
	background-color: #ffffff;
}
.thumbnail {
	margin-bottom:9px;
}
.accordion-group {
	background:#fff;
}
/* Site Title (if no logo) */
.site-title {
	font-size: 40px;
	line-height: 48px;
	font-weight: bold;
}
.brand {
	color: darken(@linkColor, 20%);
	.transition(color .5s linear);
}
.brand:hover {
	color: @linkColor;
	text-decoration: none;
}
/* Header */
.header{
	margin-bottom: 10px;
}
.header .finder {
	margin-top: 14px;
}
.header .finder .btn{
	margin-top: 0px;
}
/* Nav */
.navigation{
	padding: 5px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.075);
	border-bottom: 1px solid rgba(0, 0, 0, 0.075);
	margin-bottom: 10px;
}
.navigation .nav-pills{
	margin-bottom: 0;
}
/* Hero Banner Unit */
.hero-unit{
	background-color: #08C;
}
.hero-unit > *{
	color: white;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
/* Container */
.container{
	max-width: 960px;
}
.body .container{
	background-color: #fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	padding: 20px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.05);
	-webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.05);
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.05);
}
/* Wells */
.well .page-header{
	margin: 0px 0px 5px 0px;
}
/* Headings */

h1, h2, h3, h4, h5, h6 {
  margin: (@baseLineHeight / 1.5) 0;
}
h1 { font-size: 26px; line-height: 28px; }
h2 { font-size: 22px; line-height: 24px; }
h3 { font-size: 18px; line-height: 20px; }
h4 { font-size: 14px; line-height: 16px; }
h5 { font-size: 13px; line-height: 15px; }
h6 { font-size: 12px; line-height: 14px; }
/* Module */
.module-header {
	padding-bottom: 17px;
	margin: 20px 0 18px 0;
	border-bottom: 1px solid #eeeeee;
}
/* Single Item */
.item-title {
	margin-bottom:9px;
}
.item-content {
	margin:18px 0;
}
.item-subtitle {
	margin-bottom:9px;
}
.pull-right.item-image {
	margin:0 0 18px 20px;
}
.pull-left.item-image {
	margin:0 20px 18px 0;
}
.header .nav > li:last-child > .dropdown-menu,
.item-actions .dropdown-menu,
.item-comment .dropdown-menu {
	left:initial;
	right:0;
}
.article-index {
	margin:0 0 10px 10px;
}
/* List */
.list-item-title {
	margin-bottom:9px;
}
.list-item-content {
	margin:18px 0;
}
.list-item-subtitle {
	margin-bottom:9px;
}
/* More Items */
.items-more,
.content-links {
	padding: 15px 0;
}
/* Breadcrumbs */
.breadcrumb {
	margin: 10px 0;
}
/* Caption fixes */
.img_caption .left {
	float: left;
	margin-right: 1em;
}

.img_caption .right {
	float: right;
	margin-left: 1em;
}

.img_caption .left p {
	clear: left;
	text-align: center;
}

.img_caption .right p {
	clear: right;
	text-align: center;
}

.img_caption  {
	text-align: center!important;
}

.img_caption.none {
	margin-left:auto;
	margin-right:auto;
}
/* Aside Subnavs */
#aside .nav .nav-child {
	border-left: 2px solid @tableBorder;
	padding-left: 5px;
}
/* Navigation Submenus */
// The dropdown menu (ul)
// ----------------------
.navigation {
	.nav-child {
		position: absolute;
		top: 95%;
		left: 0;
		z-index: @zindexDropdown;
		display: none; // none by default, but block on "open" of the menu
		float: left;
		min-width: 160px;
		padding: 5px 0;
		margin: 2px 0 0; // override default ul
		list-style: none;
		background-color: @dropdownBackground;
		border: 1px solid #ccc; // Fallback for IE7-8
		border: 1px solid @dropdownBorder;
		*border-right-width: 2px;
		*border-bottom-width: 2px;
		.border-radius(6px);
		.box-shadow(0 5px 10px rgba(0,0,0,.2));
		-webkit-background-clip: padding-box;
		 -moz-background-clip: padding;
		      background-clip: padding-box;
		
		// Aligns the dropdown menu to right
		&.pull-right {
			right: 0;
			left: auto;
		}
		
		// Dividers (basically an hr) within the dropdown
		.divider {
			.nav-divider(@dropdownDividerTop, @dropdownDividerBottom);
		}
		
		// Links within the dropdown menu
		a {
			display: block;
			padding: 3px 20px;
			clear: both;
			font-size: @baseFontSize;
			font-weight: normal;
			line-height: @baseLineHeight;
			color: @dropdownLinkColor;
			white-space: nowrap;
		}
	}
	.nav > li {
		position: relative;
	}
	.nav > li:hover > .nav-child,
	.nav > li > a:focus + .nav-child, {
		display: block;
	}
	.nav-child:before {
	  position: absolute;
	  top: -7px;
	  left: 9px;
	  display: inline-block;
	  border-right: 7px solid transparent;
	  border-bottom: 7px solid #ccc;
	  border-left: 7px solid transparent;
	  border-bottom-color: rgba(0, 0, 0, 0.2);
	  content: '';
	}
	.nav-child:after {
	  position: absolute;
	  top: -6px;
	  left: 10px;
	  display: inline-block;
	  border-right: 6px solid transparent;
	  border-bottom: 6px solid #ffffff;
	  border-left: 6px solid transparent;
	  content: '';
	}
}

// Hover state
// -----------
.navigation .nav-child li > a:hover,
.navigation .nav-child li > a:focus,
.navigation .nav-child:hover > a {
  text-decoration: none;
  color: @dropdownLinkColorHover;
  background-color: @dropdownLinkBackgroundHover;
  #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
}

@media (max-width: 480px) {
	.item-info > span {
		display:block;
	}
	.blog-item .pull-right.item-image {
		margin:0 0 18px 0;
	}
	.blog-item .pull-left.item-image {
		margin:0 0 18px 0;
		float:none;
	}
}
@media (max-width: 768px) {
	body {
		padding-top: 0;
	}
	.header {
		background:transparent;
	}
	.header .brand {
		float:none;
		display:block;
		text-align:center;
	}
	.header .nav.pull-right,
	.header-search {
		float:none;
		display:block;
	}
	.header-search form {
		margin: 0;
	}
	.header-search .search-query {
		width: 90%;
	}
	.header .nav-pills > li > a {
		border: 1px solid @tableBorder;
		border-bottom:0;
		margin:0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		margin-right: 0;
	}
	.header .nav-pills > li:first-child > a {
		-webkit-border-radius: 4px 4px 0 0;
		-moz-border-radius: 4px 4px 0 0;
		border-radius: 4px 4px 0 0;
	}
	.header .nav-pills > li:last-child > a {
		-webkit-border-radius: 0 0 4px 4px;
		-moz-border-radius: 0 0 4px 4px;
		border-radius: 0 0 4px 4px;
		border-bottom:1px solid @tableBorder;
	}
	.modal.fade {
		top:-100%;
	}
	.nav-tabs {
		border-bottom: 0;
	}
	.nav-tabs > li {
		float: none;
	}
	.nav-tabs > li > a {
		border: 1px solid @tableBorder;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		margin-right: 0;
	}
	.nav-tabs > li:first-child > a {
		-webkit-border-radius: 4px 4px 0 0;
		-moz-border-radius: 4px 4px 0 0;
		border-radius: 4px 4px 0 0;
	}
	.nav-tabs > li:last-child > a, .nav-tabs > .active:last-child > a {
		-webkit-border-radius: 0 0 4px 4px;
		-moz-border-radius: 0 0 4px 4px;
		border-radius: 0 0 4px 4px;
		border-bottom:1px solid @tableBorder;
	}
	.nav-tabs > li > a:hover {
		border-color: @tableBorder;
		z-index: 2;
	}
	.nav-tabs.nav-dark > li > a {
		border: 1px solid @grayDark;
	}
	.nav-tabs > li:last-child > a, .nav-tabs > .active:last-child > a {
		border-bottom:1px solid @grayDark;
	}
	.nav-tabs.nav-dark > li > a:hover {
		border-color: @grayDark;
	}
	.nav-pills > li {
		float: none;
	}
	.nav-pills > li > a {
		margin-right: 0;
	}
	.nav-pills > li > a {
		margin-bottom: 3px;
	}
	.nav-pills  > li:last-child > a {
		margin-bottom: 1px;
	}
	.form-search > .pull-left,
	.form-search > .pull-right {
		float:none;
		display:block;
		margin-bottom:9px;
	}
}
@media (max-width: 980px) {
	.navbar-fixed-top {
		margin-bottom:0!important;
	}
	.item-comment .item-image{
		display:none;
	}
	.well {
		padding: 10px;
	}
}
@media (min-width: 768px) and (max-width: 979px) {
	#login-form .input-small {
		width: 62px;
	}
}
// Page break
dl.tabs {
	float: left;
	margin-bottom: -1px;
}
dl.tabs dt.tabs {
	float: left;
	margin-left: 3px;
	padding: 4px 10px;
	background-color: #F0F0F0;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
}
dl.tabs dt:hover {
	background-color: #F9F9F9;
}
dl.tabs dt.open {
	background-color: #FFF;
	border-bottom: 1px solid #FFF;
}
dl.tabs dt.tabs h3 {
	margin: 0;
	font-size: 1.1em;
	font-weight: normal;
}
dl.tabs dt.tabs h3 a {
	color: #0088CC;
}
dl.tabs dt.tabs h3 a:hover {
	color: #005580;
	text-decoration: none;
}
dl.tabs dt.open h3 a {
	color: #000;
	text-decoration: none;
}
div.current dd.tabs {
	margin: 0;
	padding: 10px;
	clear: both;
	border: 1px solid #CCC;
	background-color: #FFF;
}