/*
Theme Name: JustFood
Description: Wordpress theme for JustFoodERP (2017)
Version: 1.0
*/
@font-face { font-family: "AvenirNextRegular"; src: url("../fonts/1491474/069faa0e-9913-48c4-9ef7-89a4bc080b65.eot?#iefix"); src: url("../fonts/1491474/069faa0e-9913-48c4-9ef7-89a4bc080b65.eot?#iefix") format("eot"), url("../fonts/1491474/7db1f672-3a8f-4d19-9c49-7f61aed450b5.woff2") format("woff2"), url("../fonts/1491474/4ab86b35-c0c2-42b5-98ad-4b6eba66b197.woff") format("woff"), url("../fonts/1491474/276b3566-1c3b-4bc1-8915-15314f091f29.ttf") format("truetype"); }
@font-face { font-family: "AvenirNextDemi"; src: url("../fonts/1491482/fbf4298d-ef75-419c-b615-47f209a48ed2.eot?#iefix"); src: url("../fonts/1491482/fbf4298d-ef75-419c-b615-47f209a48ed2.eot?#iefix") format("eot"), url("../fonts/1491482/40d36b4a-60c6-460a-bf43-4c948c23563e.woff2") format("woff2"), url("../fonts/1491482/45b78f45-e639-4836-8612-e0892e120f14.woff") format("woff"), url("../fonts/1491482/cbc021cc-b96f-4c82-ba0d-59cb0b7449c0.ttf") format("truetype"); }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: "AvenirNextRegular", "Avenir Next", "Avenir", sans-serif; font-size: 18px; line-height: 1.333; color: #808285; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "AvenirNextDemi", "Avenir Next", "Avenir", sans-serif; color: #4d4d4f; font-weight: normal; }

h1, .h1, h2, .h2, h3, .h3 { margin: 0 0 10px; }

h1, .h1 { font-size: 30px; line-height: 36px; }

h2, .h2 { font-size: 24px; line-height: 30px; }

h3, .h3 { font-size: 20px; line-height: 24px; }

h4, .h4 { font-size: 18px; line-height: 22px; }

h5, .h5 { font-size: 16px; line-height: 20px; }

p { margin: 10px 0 0; }

.smaller { font-size: 16px; line-height: 22px; }

.small { font-size: 14px; line-height: 20px; }

.text-cranberry { color: #c6402c; }

.container-narrow p, .container-narrow ul, .container-narrow ol { font-size: 20px; line-height: 30px; }
.container-narrow p { margin-top: 30px; }
.container-narrow p + ul, .container-narrow p + ol { margin-top: 15px; }

strong, b { font-weight: normal; font-family: "AvenirNextDemi"; }

a, button { color: #f04e37; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
a:hover, a:focus, a:active, button:hover, button:focus, button:active { color: #c6402c; text-decoration: none; }
a:hover img, a:focus img, a:active img, button:hover img, button:focus img, button:active img { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85); opacity: 0.85; -moz-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease; }

img + h1, img + h2, img + h3 { margin-top: 10px; }

.alignnone { margin-top: 30px; }

.aligncenter { display: block; margin: 30px auto 0; }

.alignright { float: right; margin: 30px 0 0 20px; }

.alignleft { float: left; margin: 30px 20px 0 0; }

body article { margin: 80px 0; }
body article img.wp-post-image, body article img[class*="wp-image-"] { margin-top: 30px; max-width: 100%; height: auto; }

body.blog article, body.archive article { margin: 80px 0; }
body.blog article .post-date, body.archive article .post-date { margin: 0; }
body.blog article .post-title, body.archive article .post-title { margin: 10px 0 0; }
body.blog article .post-title a, body.archive article .post-title a { color: #4d4d4f; }
body.blog article .post-title a:hover, body.archive article .post-title a:hover { color: #c6402c; }

body.single .content { padding-bottom: 80px; }
body.single article img + h1, body.single article img + h2, body.single article img + h3, body.single article img + h4, body.single article img + h5, body.single article p + h1, body.single article p + h2, body.single article p + h3, body.single article p + h4, body.single article p + h5, body.single article ul + h1, body.single article ul + h2, body.single article ul + h3, body.single article ul + h4, body.single article ul + h5, body.single article ol + h1, body.single article ol + h2, body.single article ol + h3, body.single article ol + h4, body.single article ol + h5 { margin-top: 50px; }
body.single article p img { margin: 20px 0 !important; }
body.single article .post-tags { margin: 60px 0; }
body.single article .post-tags a { display: inline-block; margin: 0 10px 10px 0; padding: 0 20px; background-color: transparent; border: 2px solid #f04e37; color: #f04e37; font-size: 14px; font-weight: normal; font-family: "AvenirNextDemi"; line-height: 40px; white-space: nowrap; border-radius: 0; }
body.single article .post-tags a:hover, body.single article .post-tags a:focus, body.single article .post-tags a:active { color: #fff; background-color: #f04e37; }
body.single article .post-share { margin: 60px 0; }
body.single article .post-share a + a { margin-left: 12px; }
body.single article .post-author .author-avatar img { margin: 0; width: 150px; height: 150px; }
body.single article .post-author .author-info .h1 { margin-top: 20px; font-size: 30px; line-height: 36px; text-transform: capitalize; }
body.single article .post-author .author-info p { margin-top: 12px; }
body.single div.email-sub p { margin-top: 12px; }
body.single div.email-sub a.btn { margin-top: 15px; }

#comments { margin-top: 60px; }
#comments form .if-logged-in { line-height: 1; }
#comments form .if-logged-in + .submit-wrap { margin-top: -30px; }
@media (max-width: 500px) { #comments form .if-logged-in { text-align: left; }
  #comments form .if-logged-in + .submit-wrap { margin-top: 5px; } }
#comments form small { font-size: 15px; }
#comments ul.commentlist { margin: 0; padding: 0; list-style: none; }
#comments ul.commentlist li.comment { margin-top: 60px; }
#comments ul.commentlist .comment-author { margin-bottom: 8px; }
#comments ul.commentlist .comment-author img.avatar, #comments ul.commentlist .comment-author span.says { display: none; }
#comments ul.commentlist .comment-author cite, #comments ul.commentlist .comment-author cite a { color: #4d4d4f; font: normal normal 24px/30px "AvenirNextDemi"; }
#comments ul.commentlist .comment-meta, #comments ul.commentlist .comment-meta a { color: #4d4d4f; font: normal normal 16px/20px "AvenirNextDemi"; }
#comments ul.commentlist p { margin-top: 7px; }
#comments ul.commentlist .reply { margin-top: 3px; }
#comments ul.commentlist .reply a { font: normal 16px/20px "AvenirNextDemi"; }
#comments ul.commentlist section#respond { margin-top: 40px; }
#comments ul.commentlist ul.children { list-style: none; margin-top: 60px; padding-left: 40px; }

input[type="text"], input[type="email"], input[type="password"], textarea { padding: 20px; width: 100%; font-size: 20px; background-color: #f1f2f2; border: 2px solid transparent; outline: none; }
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus { border-color: #f04e37; color: #f04e37; }

a[class^="btn"], button[class^="btn"], input[type="submit"][class^="btn"] { display: inline-block; margin: 20px 0 0; padding: 0 20px; min-width: 110px; background-color: transparent; border: 2px solid #f04e37; color: #f04e37; font-size: 14px; font-weight: normal; font-family: "AvenirNextDemi"; line-height: 40px; text-align: center; white-space: nowrap; border-radius: 0; }
a[class^="btn"]:hover, a[class^="btn"]:focus, a[class^="btn"]:active, button[class^="btn"]:hover, button[class^="btn"]:focus, button[class^="btn"]:active, input[type="submit"][class^="btn"]:hover, input[type="submit"][class^="btn"]:focus, input[type="submit"][class^="btn"]:active { color: #fff; background-color: #f04e37; }
a.btn-alt, button.btn-alt, input[type="submit"].btn-alt { border: 2px solid #fff; color: #fff; }
a.btn-alt:hover, a.btn-alt:focus, a.btn-alt:active, button.btn-alt:hover, button.btn-alt:focus, button.btn-alt:active, input[type="submit"].btn-alt:hover, input[type="submit"].btn-alt:focus, input[type="submit"].btn-alt:active { background-color: #fff; color: #f04e37; }

ul { font-size: 16px; line-height: 24px; margin: 0; padding-left: 20px; }
ul.bullet-angle-right { list-style: none; }
ul.bullet-angle-right.white li:before { color: #fff; }
ul.bullet-angle-right li { position: relative; }
ul.bullet-angle-right li:before { content: "\f105"; font-family: "Fontawesome"; position: absolute; left: -1em; }
ul.list-3byX { padding: 0; column-count: 2; }
ul.list-3byX li { margin-left: 1em; }
@media (min-width: 768px) { ul.list-3byX { column-count: 3; }
  ul.list-2byX { column-count: 2; padding-left: 0; }
  ul.list-2byX li { margin-left: 1em; } }

.list-inline img[src*="disc"] { margin-bottom: 4px; }
.list-inline.list-5byX { margin-left: -15px; margin-right: -15px; }
.list-inline.list-5byX li { padding: 15px; width: 49%; }
.list-inline.padding-left li:not(:first-child) { padding: 0 0 0 20px; }
@media (min-width: 768px) { .list-inline.list-5byX { margin-left: -30px; margin-right: -30px; }
  .list-inline.list-5byX li { width: 24%; } }
@media (min-width: 992px) { .list-inline.list-5byX li { width: 19%; } }

.container { width: auto; max-width: 992px; padding-left: 25px; padding-right: 25px; }

.container-narrow { max-width: 730px; margin: 0 auto; padding-left: 25px; padding-right: 25px; }

.row { margin-left: -25px; margin-right: -25px; }
.row div[class^="col"] { padding-left: 25px; padding-right: 25px; }

hr { border-width: 2px; }

.sep { height: 50px; }

.sep-xs { height: 10px; }

.sep-sm { height: 30px; }

.sep-lg { height: 80px; }

.bg-white, .bg-whitesmoke, .bg-cranberry, footer#footer { padding-top: 50px; padding-bottom: 50px; }
.bg-white.hero-img-bottom, .bg-whitesmoke.hero-img-bottom, .bg-cranberry.hero-img-bottom, footer.hero-img-bottom#footer { padding-bottom: 0; }

.bg-white { background-color: #fff; }

.bg-whitesmoke { background-color: #f1f2f2; }
.bg-whitesmoke hr { border-color: #e4e6e6; }

.bg-cranberry, footer#footer { background-color: #c6402c; color: #fff; }
.bg-cranberry h1, footer#footer h1, .bg-cranberry .h1, footer#footer .h1, .bg-cranberry h2, footer#footer h2, .bg-cranberry .h2, footer#footer .h2, .bg-cranberry h3, footer#footer h3, .bg-cranberry .h3, footer#footer .h3, .bg-cranberry h4, footer#footer h4, .bg-cranberry .h4, footer#footer .h4, .bg-cranberry h5, footer#footer h5, .bg-cranberry .h5, footer#footer .h5, .bg-cranberry h6, footer#footer h6, .bg-cranberry .h6, footer#footer .h6, .bg-cranberry a, footer#footer a { color: #fff; }
.bg-cranberry a:hover, footer#footer a:hover { color: #fbc7b2; }

.hero { color: #fff; background-color: #c6402c; }
.hero h1 { font-size: 48px; line-height: 58px; }
.hero h1, .hero h2, .hero h3, .hero a { color: inherit; }
.hero a:not([class^="btn"]):hover { color: #fbc7b2; }
.hero.hero-md { padding: 160px 0 80px; }
.hero.hero-md.hero-bg-img { padding: 180px 0 120px; position: relative; }
.hero.hero-md.hero-bg-img h3 { margin-bottom: 20px; font-size: 30px; line-height: 1; }
.hero.hero-md.hero-bg-img:before { content: ""; background-color: rgba(0, 0, 0, 0.65); position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; }
.hero.hero-md.hero-bg-img .container { position: relative; z-index: 2; }
.hero.hero-sm { padding: 125px 0 15px; }
.hero.hero-sm h1 { font-size: 30px; line-height: 36px; }
.hero.hero-bg-img { background-repeat: no-repeat; background-position: center top; background-size: cover; }
@media (min-width: 768px) { .hero.hero-md h1 { font-size: 60px; line-height: 70px; }
  .hero.hero-md h1.smaller { font-size: 48px; line-height: 58px; }
  .hero.hero-md h1.bigger { font-size: 80px; line-height: 90px; } }
@media (max-width: 767px) { .hero.hero-md h1 { font-size: 38px; line-height: 48px; }
  .hero.hero-md h3 { font-size: 24px !important; } }

img[src*="logo-justfood"] { width: auto; height: 70px; }

nav#navbar-main, nav.navbar-default { position: absolute; width: 100%; margin-bottom: 0; padding-top: 20px; padding-bottom: 20px; background-color: transparent; border: none; z-index: 999; }
nav#navbar-main.scrolled, nav.navbar-default.scrolled { background-color: #c6402c; transition: 0.5s background-color; }
nav#navbar-main .navbar-nav, nav.navbar-default .navbar-nav { font-size: 14px; text-transform: uppercase; }
nav#navbar-main .navbar-nav li > a, nav.navbar-default .navbar-nav li > a { padding-left: 10px; padding-right: 10px; color: #fff; font-weight: normal; font-family: "AvenirNextDemi"; border: none; }
nav#navbar-main .navbar-nav li > a:hover, nav#navbar-main .navbar-nav li > a:focus, nav#navbar-main .navbar-nav li > a:active, nav.navbar-default .navbar-nav li > a:hover, nav.navbar-default .navbar-nav li > a:focus, nav.navbar-default .navbar-nav li > a:active { color: #fbc7b2; }
nav#navbar-main .navbar-brand, nav.navbar-default .navbar-brand { height: auto; padding: 0 15px 0 25px; }
nav#navbar-main button[class^="navbar-toggle"], nav.navbar-default button[class^="navbar-toggle"] { color: #fff; font-size: 30px; background-color: transparent; border: none; outline: none; }
nav#navbar-main button.navbar-toggle-open, nav.navbar-default button.navbar-toggle-open { position: relative; float: right; margin: 17px 25px 0 0; padding: 9px 10px; border: 2px solid #fff; }
nav#navbar-main button.navbar-toggle-open .icon-bar, nav.navbar-default button.navbar-toggle-open .icon-bar { display: block; width: 22px; height: 2px; background-color: #fff; }
nav#navbar-main button.navbar-toggle-open .icon-bar + .icon-bar, nav.navbar-default button.navbar-toggle-open .icon-bar + .icon-bar { margin-top: 4px; }
nav#navbar-main button.navbar-toggle-close, nav.navbar-default button.navbar-toggle-close { margin-top: 30px; }
nav#navbar-main button.navbar-toggle-close .icon-x, nav.navbar-default button.navbar-toggle-close .icon-x { position: relative; display: block; width: 22px; height: 22px; }
nav#navbar-main button.navbar-toggle-close .icon-x:before, nav#navbar-main button.navbar-toggle-close .icon-x:after, nav.navbar-default button.navbar-toggle-close .icon-x:before, nav.navbar-default button.navbar-toggle-close .icon-x:after { content: ""; position: absolute; top: 10px; display: block; width: 22px; height: 2px; background-color: #fff; }
nav#navbar-main button.navbar-toggle-close .icon-x:before, nav.navbar-default button.navbar-toggle-close .icon-x:before { transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); }
nav#navbar-main button.navbar-toggle-close .icon-x:after, nav.navbar-default button.navbar-toggle-close .icon-x:after { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); }
@media (min-width: 768px) { nav#navbar-main .navbar-nav, nav.navbar-default .navbar-nav { padding-top: 10px; }
  nav#navbar-main .navbar-nav a.btn-alt, nav.navbar-default .navbar-nav a.btn-alt { margin-top: 4px; padding-top: 0; padding-bottom: 0; min-width: 130px; font-size: 14px; line-height: 40px; text-align: center; text-transform: none; border: 2px solid #fff; }
  nav#navbar-main .navbar-nav a.btn-alt:hover, nav#navbar-main .navbar-nav a.btn-alt:focus, nav#navbar-main .navbar-nav a.btn-alt:active, nav.navbar-default .navbar-nav a.btn-alt:hover, nav.navbar-default .navbar-nav a.btn-alt:focus, nav.navbar-default .navbar-nav a.btn-alt:active { background-color: #fff; color: #f04e37; }
  nav#navbar-main .container .navbar-brand, nav.navbar-default .container .navbar-brand { margin-left: -25px; }
  nav#navbar-main .navbar-right, nav.navbar-default .navbar-right { margin: 0; }
  nav#navbar-main button[class^="navbar-toggle"], nav.navbar-default button[class^="navbar-toggle"] { display: none; } }
@media (max-width: 767px) { nav#navbar-main .container .navbar-header, nav#navbar-main .container .navbar-slide, nav.navbar-default .container .navbar-header, nav.navbar-default .container .navbar-slide { margin-left: -25px; margin-right: -25px; }
  nav#navbar-main .container .navbar-slide, nav.navbar-default .container .navbar-slide { position: fixed; top: 0; bottom: 0; left: 0; right: 0; width: 0; height: 100%; margin: 0; text-align: center; background-color: #c6402c; opacity: 0; overflow: hidden; transition: 0.3s all ease; }
  nav#navbar-main .container .navbar-slide ul.navbar-nav, nav.navbar-default .container .navbar-slide ul.navbar-nav { margin: 10px 0 0; }
  nav#navbar-main .container .navbar-slide ul.navbar-nav + ul.navbar-nav, nav.navbar-default .container .navbar-slide ul.navbar-nav + ul.navbar-nav { margin: 0 0 10px; }
  nav#navbar-main .container .navbar-slide ul.navbar-nav a[href*="get-started"], nav.navbar-default .container .navbar-slide ul.navbar-nav a[href*="get-started"] { margin: 0; }
  nav#navbar-main .container .navbar-slide.in, nav.navbar-default .container .navbar-slide.in { opacity: 1; width: 100%; } }

footer#footer hr { margin: 40px 0; border-color: #f04e37; border-width: 2px; }
footer#footer a.btn-alt:hover { color: #f04e37; }
footer#footer div.sitemap ul { list-style: none; margin: 0; padding: 0; font-size: 14px; line-height: 1.2; }
footer#footer div.sitemap li:first-child { font-weight: normal; font-family: "AvenirNextDemi"; text-transform: uppercase; }
footer#footer div.sitemap li:not(:last-child) { margin-bottom: 6px; }
footer#footer div.trio h4 img { float: left; margin-top: -4px; margin-right: 10px; }
footer#footer ul.social { margin-bottom: 40px; }
footer#footer ul.social a { display: inline-block; text-align: center; line-height: 36px; width: 36px; height: 36px; border-radius: 50%; background-color: #fff; font-size: 20px; }
footer#footer ul.social a:hover { background-color: #fbc7b2; }
footer#footer ul.social i { color: #c6402c; margin-top: 8px; }
@media (max-width: 767px) { footer#footer div.sitemap div[class^="col"]:nth-child(odd) { clear: left; }
  footer#footer div.sitemap div[class^="col"]:nth-child(even) { clear: right; }
  footer#footer div.sitemap div[class^="col"]:not(:nth-last-child(-n+2)) { margin-bottom: 30px; }
  footer#footer div.trio div[class^="col"]:not(:last-child) { margin-bottom: 40px; } }