/*------------------------------------*\
            	#MAIN
\*------------------------------------*/

body {
	font-family: "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
	/*font-size: 16px;*/
	color: #073446;
	background: #fff url(../images/page-bg.png) top repeat-y;
	-webkit-background-size: 100% 1740px;
	   -moz-background-size: 100% 1740px;
		 -o-background-size: 100% 1740px;
			background-size: 100% 1740px;
}

@media (max-width: 1200px) {
	body {
		-webkit-background-size: cover;
  		   -moz-background-size: cover;
  			 -o-background-size: cover;
  				background-size: cover;
	}
}

@media (min-width: 1900px) {
	body {
		-webkit-background-size: cover;
  		   -moz-background-size: cover;
  			 -o-background-size: cover;
  				background-size: cover;
	}
}

.content-wrapper { 
	position: relative;
	max-width: 970px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
	background-color: rgba(255, 255, 255, 0.95); 
}

	@media (min-width: 1025px) {
		.content-wrapper { padding: 0; }
	}





/*------------------------------------*\
          #BOOTSTRAP OVERRIDES
\*------------------------------------*/

/*.navbar { margin-bottom: 0; }*/

a { color: #073446; }

.navbar-inverse {
	background-color: rgba(3, 39, 58, 0.9);
  	border: none;
}

.navbar-inverse .navbar-nav > li > a { color: #fff; }

.navbar-inverse .navbar-nav > li > a:hover, 
.navbar-inverse .navbar-nav > li > a:focus { opacity: 0.7; }

.navbar-inverse .navbar-toggle:hover, 
.navbar-inverse .navbar-toggle:focus { background: #29566C; }

.navbar-inverse .navbar-toggle { border-color: #30505F; }

.navbar-brand > img { max-width: 80%; }

.navbar-brand { padding: 8px 15px; }

.breadcrumb {
	background: transparent;
}





/*------------------------------------*\
            	#NAVBAR
\*------------------------------------*/

.navbar > .container { max-width: 970px; }





/*------------------------------------*\
          #SECONDARY NAVIGATION
\*------------------------------------*/

.secondary-nav {
	margin: 0;
	padding-left: 10px;
	padding-right: 10px;
  	list-style: none;
  	background: #4f0000;
  	box-shadow: 0 0 3px rgba(0, 0, 0, 0.3)
}
	
	@media (min-width: 990px) {
		.secondary-nav { margin-bottom: -35px; }
	}

.secondary-nav > li {
  	display: block;
  	margin-bottom: 0;
  	padding-left: 0;
  	float: left;
  	list-style: none;
}

.secondary-nav > li > a {
	display: block;
  	padding: 5px 10px;
	color: #fff;
	text-decoration: none;
}

.secondary-nav > li > a:hover,
.secondary-nav > li > a:focus { opacity: 0.8; }





/*------------------------------------*\
            #MAIN CONTENT
\*------------------------------------*/

@media (min-width: 1025px) {
	.page-heading { padding: 0 15px; }
}

.banner { 
	position: relative;
	margin-bottom: 20px;
	text-align: center; 
}

.banner img {
	display: block;
	width: 100%;
	max-width: 100%;
}

.banner__info {
	position: absolute;
	left: 15px;
	bottom: 0;
	margin: 0;	
}

.banner__info > small { 
	font-size: 55%;
	color: #182d39; 
}





/*------------------------------------*\
          #FEATURE CONTENT
\*------------------------------------*/

@media (min-width: 768px) {
	.feature { padding: 20px 20px 0; }
}

.feature--highlighted { border-bottom: solid 1px #666; }

.feature__title { margin-top: 10px; }

.feature__title--highlighted,
.feature__summary--highlighted { color: #871313; }

.feature__summary { color: #0C0F10; }

.feature__image { 
	display: block;
	text-align: center; 
	margin-bottom: 15px;
}

	.feature__image:hover { opacity: 0.9; }

	@media (min-width: 768px) {
		.feature__image { 
			margin-left: -20px;
			margin-right: -20px;
		}

		.feature__image--inline {
			margin-left: 0;
			margin-right: 0;
		}
	}

.feature__image img {
	display: block;
	width: 100%;
	max-width: 100%;
	border: none;
}

.inline-heading {
	text-transform: uppercase;
	color: #871313;
	font-weight: 700;
}





/*------------------------------------*\
          	  #RIGHT BLOCK
\*------------------------------------*/

.side-block-item {
	position: relative;
	display: block;
	margin-top: 15px;
	margin-bottom: 15px;
}

	.side-block-item:hover { opacity: 0.8; }

.side-block-item__title {
	position: absolute;
	top: 10px;
	left: 0;
	right: 0;
	width: 100%;
	margin: 0;
	padding: 5px 10px;
	color: #073446;
	font-size: 28px;
	background: rgba(255,255,255,0.8);
}

.side-block-item__img {
	display: block;
	width: 100%;
	max-width: 100%;
}





/*------------------------------------*\
             #INGREDIENTS
\*------------------------------------*/

.ingredient {
	position: relative;
	display: block;
	text-align: center;
	margin-bottom: 25px;
	text-decoration: none;
	color: #073446;
}

	.ingredient:hover,
	.ingredient:focus,
	.ingredient:active,
	.ingredient.active {
		text-decoration: none;
		opacity: 0.8;
	}

.ingredient__image { margin-bottom: 5px; }

.ingredient__image img {
	display: block;
	margin: auto;
	/*width: 100%;*/
	max-width: 100%;
	max-height: 100%;
}

.ingredient__name { 
	margin-bottom: 0; 
	font-size: 16px;
}

.ingredient__type { 
	color: #bf1c37;
	font-size: 12px;
	text-transform: uppercase;
}

.featured-ingredients { 
	padding: 10px;
	background: #f2f1f1; 
}

	@media (min-width: 768px) { 
		.featured-ingredients {
			margin-left: -20px;
			margin-right: -20px;
		}
		.featured-ingredients .ingredient { margin-bottom: 10px; } 
	}

	@media (min-width: 993px) {
		.featured-ingredients .ingredient__image { height: 110px; }
		.search-result-ingredients .ingredient__image { height: 110px; }
	}





/*------------------------------------*\
            #RECIPE FILTER
\*------------------------------------*/

.recipe-filter {
	position: relative;
	margin-bottom: 15px;
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.06);
	background: #fff;
}

.filter--highlighted { background: #f6f6f6; }

@media (max-width: 767px) {
	.tastes { margin-bottom: 15px; }
}

.taste__item {
	display: inline-block;
	padding: 5px;
	color: #bbb;
	font-size: 38px;
	line-height: 38px;
}

	.taste__item:hover,
	.taste__item:active,
	.taste__item.active,
	.taste__item:focus.active,
	.taste__item:focus:hover {
		color: #fcd933;
		text-decoration: none;
	}

	.taste__item:focus {
		text-decoration: none;
		color: #bbb;
	}

.filter-world-map {
	text-align: center;
	margin-bottom: 10px;
}

.filter-world-map img {
	display: block;
	width: 100%;
	max-width: 100%;
}

@media (max-width: 767px) {
	.letter-search { margin-bottom: 15px; }
}

.letter-search__letters {
	display: inline-block;
	padding: 0 2px;
	line-height: 14px;
	font-size: 14px;
	font-weight: 700;
	color: #073446;
	text-transform: uppercase;
}
	
	.letter-search__letters:hover,
	.letter-search__letters:focus,
	.letter-search__letters:active,
	.letter-search__letters.active {
		color: #fcd933;
		text-decoration: none;
	}

.btn__recipe-filter {
	position: absolute;
	right: 50px;
	bottom: -20px;
	width: 55px;
	height: 55px;
	padding-left: 2px;
	padding-right: 2px;
	text-align: center;
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	background: #c91d3a;
	border-radius: 50%;
}

	.btn__recipe-filter:hover,
	.btn__recipe-filter:focus,
	.btn__recipe-filter:active,
	.btn__recipe-filter.active {
		color: #fff;
		background: #e63655;
	}


.btn__recipe-filter-reset {
	position: absolute;
	right: 120px;
	bottom: -20px;
	width: 55px;
	height: 55px;
	padding-left: 2px;
	padding-right: 2px;
	text-align: center;
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	background: #a5a5a5;
	border-radius: 50%;
}
	.btn__recipe-filter-reset:hover,
	/*.btn__recipe-filter-reset:focus,*/
	.btn__recipe-filter-reset:active,
	.btn__recipe-filter-reset.active {
		color: #fff;
		background: #e63655;
	}

.btn__recipe-filter-reset:focus {		
		color: #fff;		
	}



/*------------------------------------*\
             #SEARCH RESULTS
\*------------------------------------*/

.search-results__pagination {
	margin-bottom: 15px;
	text-align: center;
	border-top: dotted 1px #dfdedc;
	border-bottom: dotted 1px #dfdedc;
}

.search-results__pagination .pagination {
	margin: 5px 0;
	vertical-align: middle;
}

.search-results__pagination .pagination > li > a, 
.search-results__pagination .pagination > li > span {
	padding: 0 12px;
	font-size: 12px;
	color: #191919;
	text-decoration: underline;
  	border: none;
  	border-right: 1px solid #ddd;
	background-color: transparent;
}

.search-results__pagination .pagination > li.active > a, 
.search-results__pagination .pagination > li.active > span { text-decoration: none; }
	
	.search-results__pagination .pagination > li.active > a:hover, 
	.search-results__pagination .pagination > li.active > span:hover { 
		color: #191919;
		background: transparent; 
		border-color: #ddd;
	}

.search-results__pagination .pagination > li:last-child > a, 
.search-results__pagination .pagination > li:last-child > span { border-right: 0px solid transparent; }

.show-all-link {
	display: inline-block;
	margin-top: 5px;
	float: right;
	color: #191919;
	font-size: 12px;
	text-decoration: underline;
}

@media (max-width: 990px) {
	.filter-combination { 
		display: block;
		margin-top: 5px;
		margin-bottom: 5px; 
		font-size: 85%;
	}
}

@media (min-width: 768px) {
	.sort-results { text-align: right; }
}

.no-records {
	margin-top: 30px;
	margin-bottom: 30px;
	color: #aaa;
	text-align: center;
}





/*------------------------------------*\
          	  #INNER NAV
\*------------------------------------*/

.nav-inner {
	background: #572725;
	margin-bottom: 15px;
}

.nav-inner > li > a {
	padding: 6px 15px;
	color: #fff;
}

.nav-inner > li > a:hover,
.nav-inner > li > a:focus,
.nav-inner > li > a:active,
.nav-inner > li > a.active {
	background: #5e312f;
}

.nav-inner--width-fix {
	margin-right: -30px;
}

.nav-inner > li.active > a, 
.nav-inner > li.active > a:hover, 
.nav-inner > li.active > a:focus {
  	background-color: #6C4A49;
}

.nav-inner .non-link {
	padding: 6px 15px;
  	color: #fff;
}

/* To handle long ingredient/recipe names in search result page*/
@media (min-width: 768px) {
	.ingredients .col-sm-3:nth-child(5) { clear: both; }
	.ingredients .col-sm-3:nth-child(9) { clear: both; }
	.ingredients .col-sm-3:nth-child(13) { clear: both; }
}
@media (max-width: 767px) {
	.ingredients .col-sm-3:nth-child(3) { clear: both; }
	.ingredients .col-sm-3:nth-child(5) { clear: both; }
	.ingredients .col-sm-3:nth-child(7) { clear: both; }
	.ingredients .col-sm-3:nth-child(9) { clear: both; }
	.ingredients .col-sm-3:nth-child(11) { clear: both; }
	.ingredients .col-sm-3:nth-child(13) { clear: both; }
	.ingredients .col-sm-3:nth-child(15) { clear: both; }
}





/*------------------------------------*\
           #CUSTOM CHECKBOX
\*------------------------------------*/

.recipe-filter .checkbox input[type="checkbox"]:checked + label::after {
    font-family: "FontAwesome";
    content: "\f0c8";
}

.recipe-filter input[type="checkbox"].styled:checked + label:after {
    font-family: 'FontAwesome';
    content: "\f0c8";
}

.recipe-filter .checkbox label::after {
	padding-left: 4px;
	color: #fcd933;
	font-size: 12px;
}





/*------------------------------------*\
             #CLEARFIXES
\*------------------------------------*/
.secondary-nav::before,
.secondary-nav::after,
.featured-ingredients::before,
.featured-ingredients::after,
.recipe-filter::before,
.recipe-filter::after,
.ingredients::before,
.ingredients::after {
	content: " ";
	display: table;
}

.secondary-nav::after,
.featured-ingredients::after,
.recipe-filter::after,
.ingredients::after { clear: both; }


.intro {
-webkit-columns: 300px 2;
   -moz-columns: 300px 2;
        columns: 300px 2;
}