@charset "UTF-8";
@font-face { font-family: 'icomoon'; src: url("assets/icons/fonts/icomoon.eot?-9bg13n"); src: url("assets/icons/fonts/icomoon.eot?#iefix-9bg13n") format("embedded-opentype"), url("assets/icons/fonts/icomoon.woff?-9bg13n") format("woff"), url("assets/icons/fonts/icomoon.ttf?-9bg13n") format("truetype"), url("assets/icons/fonts/icomoon.svg?-9bg13n#icomoon") format("svg"); font-weight: normal; font-style: normal; }

[class^="icon-"]:before, [class*=" icon-"]:before { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-i-bulb:before { content: "\e608"; }

.icon-i-clock:before { content: "\e609"; }

.icon-i-person:before { content: "\e600"; }

.icon-i-search:before { content: "\e601"; }

.icon-i-lista:before { content: "\e602"; }

.icon-i-listakapea:before { content: "\e603"; }

.icon-i-bin:before { content: "\e604"; }

.icon-i-share:before { content: "\e605"; }

.icon-i-speechbubble:before { content: "\e606"; }

.icon-i-plus:before { content: "\e607"; }

.icon-i-cart:before { content: "\e60a"; }

.icon-i-print:before { content: "\e60c"; }

.icon-i-mail:before { content: "\e60d"; }

.icon-i-eye:before { content: "\e60e"; }

.icon-i-kello3:before { content: "\e610"; }

.icon-i-pluslight:before { content: "\e611"; }

.icon-i-quote:before { content: "\e612"; }

.icon-i-guide:before { content: "\e613"; }

.icon-i-kello2:before { content: "\e614"; }

.icon-i-camera:before { content: "\e615"; }

.icon-i-pen:before { content: "\e616"; }

.icon-i-files:before { content: "\e617"; }

.icon-i-forkknife:before { content: "\e618"; }

.icon-i-forkknifespoon:before { content: "\e619"; }

.icon-i-forks:before { content: "\e61a"; }

.icon-i-back:before { content: "\e61b"; }

.icon-i-cancel:before { content: "\e61c"; }

.icon-i-back2:before { content: "\e61d"; }

.icon-i-forward:before { content: "\e61e"; }

.icon-i-resize:before { content: "\e61f"; }

.icon-i-menuball:before { content: "\e620"; }

.icon-i-settings:before { content: "\e621"; }

.icon-i-check:before { content: "\e622"; }

.icon-i-more:before { content: "\e623"; }

.icon-i-minusball:before { content: "\e624"; }

.icon-i-plusball:before { content: "\e625"; }

.icon-i-coffee:before { content: "\e626"; }

.icon-i-watermelon:before { content: "\e627"; }

.icon-i-cake:before { content: "\e628"; }

.icon-i-sausage:before { content: "\e629"; }

.icon-i-sausage2:before { content: "\e62a"; }

.icon-i-meat:before { content: "\e62b"; }

.icon-i-pot:before { content: "\e62c"; }

.icon-i-chicken:before { content: "\e62d"; }

.icon-i-cup:before { content: "\e62e"; }

.icon-i-longsausage:before { content: "\e62f"; }

.icon-i-pear:before { content: "\e630"; }

.icon-i-crunch:before { content: "\e631"; }

.icon-i-donut:before { content: "\e632"; }

.icon-i-wine:before { content: "\e633"; }

.icon-i-pizza:before { content: "\e634"; }

.icon-i-carrot:before { content: "\e635"; }

.icon-i-can:before { content: "\e636"; }

.icon-i-bowl:before { content: "\e637"; }

.icon-i-pear2:before { content: "\e638"; }

.icon-i-fish:before { content: "\e639"; }

.icon-i-chili:before { content: "\e63a"; }

.icon-i-hotsoup:before { content: "\e63b"; }

.icon-i-slush:before { content: "\e63c"; }

.icon-i-pizza2:before { content: "\e63d"; }

.icon-i-mushroom:before { content: "\e63e"; }

.icon-cocktail:before { content: "\e63f"; }

.icon-i-radish:before { content: "\e640"; }

.icon-soupbowl:before { content: "\e641"; }

.icon-i-muffin:before { content: "\e642"; }

.icon-i-twoforks:before { content: "\e645"; }

.icon-i-onefork:before { content: "\e646"; }

/*
Theme Name: Ruoka.fi
Version: 1.0
Author: Viivamedia
Template: om-core
*/
/* DO NOT EDIT style.css DIRECTLY! */
/* ---------------------------------------- UNIVERSAL CLASSES -------------------------------------------*/
.screen-reader-text { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

.font__main { font-family: "chaparral-pro", Arial, Geneva, sans-serif; }

.font__main__title { font-family: "abril-display", georgia, serif; }

.font--uppercase { text-transform: uppercase; }

.article__body .oikea, .article-sidestory .oikea { float: right; clear: right; margin: 5px 0 10px 15px; }

.article__body .vasen, .article-sidestory .vasen { float: left; clear: left; margin: 5px 15px 10px 0; }

.aligncenter, .article__body img.aligncenter { margin-left: auto; margin-right: auto; }

body { background: #fff; }

#sivupalkki:after, .col-two:after { content: ''; display: block; clear: both; }

.some-buttons li { display: inline-block; vertical-align: middle; }

.some-buttons li a { display: block; height: 30px; width: 30px; background: #7698AD; color: #fff; line-height: 34px; border-radius: 500px; text-align: center; margin-right: 5px; font-size: 17px; }

.some-buttons li a:hover { background: #5a7f96; }

.some-buttons li a.fb-link { background: #3c5898; }

.some-buttons li a.fb-link:hover { background: #2e4373; }

.some-buttons li a.twitter-link { background: #6aadd1; }

.some-buttons li a.twitter-link:hover { background: #4398c5; }

.some-buttons li a.pinterest-link { background: #de010d; }

.some-buttons li a.pinterest-link:hover { background: #ab010a; }

.some-buttons li a.instagram-link { background: #396896; }

.some-buttons li a.instagram-link:hover { background: #2b4e71; }

.some-buttons li a.wa-link { background: #43d854; }

.some-buttons li a.wa-link:hover { background: #28c039; }

.button, button, input[type="submit"], input[type="reset"], input[type="button"], .wpfp-link { font-family: 'proxima-nova'; background: #B52828; color: #fff; border: none; cursor: pointer; display: inline-block; padding: 0px 15px; line-height: 35px; height: 35px; font-size: 13px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; transition: background 0.2s; }

.button:hover, .button:active, button:hover, button:active, input[type="submit"]:hover, input[type="submit"]:active, input[type="reset"]:hover, input[type="reset"]:active, input[type="button"]:hover, input[type="button"]:active, .wpfp-link:hover, .wpfp-link:active { background: #8b1f1f; color: #fff; }

.button:visited, button:visited, input[type="submit"]:visited, input[type="reset"]:visited, input[type="button"]:visited, .wpfp-link:visited { color: #fff; }

button:active, button:focus { outline: 0; }

input[type=text], input[type=email], input[name=email], input[type="password"], textarea, select { background: #fff; border: 1px solid #c2c2c2; font-style: normal; width: 100%; margin: 0 0 10px; color: #666; padding: 7px; font-family: "chaparral-pro", Arial, Geneva, sans-serif; }

textarea { resize: vertical; font-size: 20px; }

form label { font-family: "abril-display", georgia, serif; font-size: 20px; }

form input[type=checkbox] + label, form input[type=radio] + label { font-family: "chaparral-pro", Arial, Geneva, sans-serif; }

/*---------------------------- GRAVITY FORMS -----------------------------*/
.gform_wrapper .top_label .gfield_label { margin: 16px 0 0 !important; }

.gform_wrapper.gf_browser_chrome .gfield_checkbox li input, .gform_wrapper.gf_browser_chrome .gfield_checkbox li input[type=checkbox], .gform_wrapper.gf_browser_chrome .gfield_radio li input[type=radio] { margin-top: 9px !important; }

.gform_wrapper ul.gfield_checkbox li input[type=checkbox]:checked + label, .gform_wrapper ul.gfield_radio li input[type=radio]:checked + label { font-weight: initial !important; }

.gform_wrapper input[type=email], .gform_wrapper input[type=number], .gform_wrapper input[type=password], .gform_wrapper input[type=tel], .gform_wrapper input[type=text], .gform_wrapper input[type=url] { font-family: "chaparral-pro", Arial, Geneva, sans-serif !important; }

.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit] { font-size: 13px !important; }

.tag-ribbon { display: inline-block; background: #e7e7e7; padding: 7px; margin-bottom: 15px; font-family: "abril-display", georgia, serif; font-weight: 600; letter-spacing: 0.03em; font-style: italic; border-radius: 2px; }

#breadcrumbs { font-size: 13px; }

/*--------------------------- MENUKORTTI ----------------------------*/
.kainalo.menucard { background: url("assets/img/menukoriste.png") #f2f0f1 center 10px no-repeat; padding-top: 45px; text-align: center; }

.kainalo.menucard ul { list-style-type: none; margin-left: 0; }

.kainalo.menucard ul li { margin: 0 0 12px; }

.kainalo.menucard hr { background: url("assets/img/menukoriste_hr.png") center no-repeat; height: 3em; border: 0; }

/*----------------------- SOLR ------------------------*/
#solr-sitesearch-container .search-input { border: 1px solid #ccc; border-right: none; }

#solr-sitesearch-container .article-category a { font-family: 'proxima-nova'; color: #B52828; text-transform: uppercase; font-weight: 600; margin-right: 10px; padding: 0; font-size: 13px; margin-bottom: 4px; }

#solr-sitesearch-container .article-category a:hover { color: #611616; }

.list.blog-list-first { list-style: none; }

.widget-uusimmat .list .article-thumbnail, .wpfp-span .list .article-thumbnail, .blog-list-first.list .article-thumbnail, #recommended ul .article-thumbnail { width: 100px; height: 100px; float: left; margin: 0 15px 0 0; background-size: cover; background-position: center top; }

.widget-uusimmat .article-excerpt p, .widget-uusimmat .article-excerpt .meta, .wpfp-span .article-excerpt p, .wpfp-span .article-excerpt .meta, .blog-list-first .article-excerpt p, .blog-list-first .article-excerpt .meta, #recommended .article-excerpt p, #recommended .article-excerpt .meta { margin-left: 115px; display: block; }

.middle-ad { margin-bottom: 20px; text-align: center; }

.middle-ad a.click-for-bigger:before { display: none !important; }

/* ---------------------------------------- NEXUS -------------------------------------------*/
.recommended-titles .recommend__list { margin-top: 20px; margin-bottom: 20px; }

.recommended-titles .recommend__list li { list-style-type: none; margin-bottom: 20px; }

.recommended-titles .recommend__list h3 { display: inline; font-size: 17px; line-height: 20px; margin: 0 15px 0 0; }

.recommended-titles .recommend__list h3 a { color: #222; }

.recommended-titles .recommend__list--source { text-transform: uppercase; color: #959595; font-size: 12px; font-family: 'proxima-nova'; }

.recommended .recommend__list { margin-top: 20px; margin-bottom: 20px; }

.recommended .recommend__list li { clear: both; overflow: hidden; width: 49%; margin-right: 1%; display: inline-block; vertical-align: top; list-style-type: none; margin-bottom: 15px; }

.recommended .recommend__list li:nth-child(even) { margin-right: 0; margin-left: 1%; }

.recommended .recommend__list--thumbnail { width: 100px; height: 100px; float: left; margin: 0 15px 0 0; background-size: cover; background-position: center top; background-color: #efefef; }

.recommended .recommend__list--meta { text-transform: uppercase; color: #959595; font-size: 12px; margin-top: 13px; margin-left: 115px; font-family: 'proxima-nova'; }

.recommended .recommend__list a { color: #222; }

.recommended .recommend__list h3 { margin: 0 0 0 115px; font-size: 17px; line-height: 20px; }

@media all and (max-width: 660px) { .recommended .recommend__list li, .recommended .recommend__list li:nth-child(even) { width: 100%; margin-left: 0; margin-right: 0; } }

.wpfp-container .om-grid-container.one .om-grid { margin-bottom: 20px; }

.wpfp-container .om-grid-container.one .om-grid li { float: left; width: calc(100% - 40px); }

.wpfp-container .wpfp-link.remove-parent { float: right; width: 40px; height: 40px; background: none; padding: 0; line-height: 40px; text-align: center; font-size: 0; }

.wpfp-container .wpfp-link.remove-parent:before { content: '\f00d'; color: #ccc; font-size: 24px; font-family: 'FontAwesome'; }

.wpfp-container .wpfp-empty { font-size: 20px; line-height: 1.25; }

/* PRINT QUERIES FOR THE SHOPLIST AND RECIPES */
@media print { header, nav, footer, video, audio, object, img { display: none; }
  /* Kaikki muu paitsi sisÃ¤ltÃ¶ poisÂ */
  #sivupalkki, #topbar, .ad, #footer, #verkkopalvelut { display: none !important; }
  /* SisÃ¤llÃ¶n tyyliÂ */
  .article-body, .col-two { width: 100% !important; color: #000; }
  /* Linkkien urlit poisÂ */
  a[href]:after { content: none !important; }
  /* Napit poisÂ ostoslistasta */
  #tyhjenna-ostoslista, #tulosta-ostoslista { display: none !important; }
  /* Napit pois reseptistÃ¤ */
  #recipe-buttons-blue, .recipe-columns-lower, #respond, #recommended, .block > h2 { display: none !important; } }

/* RECIPE GRID */
#results-widget .grid-item a { color: #444; }

#results-widget .grid-item__bg { border: none; padding-bottom: 100%; }

#load-more-btn { clear: both; display: block; margin-bottom: 15px; padding: 0; text-align: center; line-height: 40px; height: 40px; }

.desktop-button { margin: 10px 0 0 0; text-align: center; display: block; }

#advanced_search .solr-searchbar { padding-right: 0; padding-left: 0; }

#advanced_search .solr-searchbar .search-input { border: 1px solid #c2c2c2; border-right: none; width: calc(100% - 55px); }

#advanced_search .solr-searchbar .search-submit, #advanced_search .solr-searchbar .search-input { margin-top: 0; margin-bottom: 22px; }

img.displayed { display: block; margin-left: auto; margin-right: auto; }

[class^="icon-"] { font-size: inherit; }

.hiddenByDefault { display: none; }

.fixed { position: fixed; }

.advancedSearchToggle { line-height: 38px; }

#advanced_search { overflow: hidden; position: relative; margin-bottom: 20px; margin-top: 24px !important; max-width: 1024px; padding-bottom: 25px; margin: 0 auto; }

#advanced_search .left-col { float: left; width: 33.33%; box-sizing: border-box; padding-right: 15px; }

#advanced_search .right-col { float: left; width: 66.66%; }

.toggle-link { height: 40px; text-transform: uppercase; padding: 0 36px 1rem 0; border-top: #ccc solid 1px; position: relative; display: block; cursor: pointer; }

.toggle-link:after { content: '\f077'; font-family: 'FontAwesome'; color: #ababab; position: absolute; right: 3px; top: 33%; font-size: 16px; transition: 0.2s all ease; }

.toggle-link.toggled:after { content: '\f078'; }

.widgetBox:first-child .toggle-link:first-of-type { border-top: 0; }

.widgetBox:last-child .toggle-link:last-of-type { border-bottom: 0; }

.widgetbox-container { display: block; border-top: none; overflow: hidden; box-sizing: border-box; }

.widgetBox { box-sizing: border-box; font-size: 0.90rem; }

.widgetBox label { font-size: inherit; display: table-cell; text-transform: uppercase; width: 100%; padding-left: 0.4em; }

label span { text-align: right; border: 0px; outline: 0px; }

label span:hover { outline: 0px; border: 0px; }

.widgetBox label .labelText, .widgetBox .tab-link { font-family: "abril-display", georgia, serif; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; font-size: 14px; color: #444; }

.tab-link [class^="icon-"], .widgetBox label [class^="icon-"] { font-size: 2.4em; position: relative; display: inline-block; bottom: -0.2em; color: #acacac; margin-left: -0.05em; text-align: center; }

.widgetBox label [class^="icon-"] { color: #ccc; width: 1em; }

#meals-diets a, #meals-diets a:visited { color: #444; }

#meal-type-tab { overflow: hidden; }

#diet-type-tab { overflow: hidden; display: none; }

#main-ingredients, #seasons-and-themes, #recipe-prep-time, #recipe-difficulty, #recipe-author { display: none; }

.tab { padding: 0 5px; }

.tab a.toggle { display: inline-block; width: 33%; vertical-align: top; padding-bottom: 0.9em; padding-top: 0.5em; }

.data-container { margin-bottom: 0.4em; }

.diet-ball { font-size: 0.7em; line-height: 1.4em; text-align: center; text-transform: uppercase; overflow: hidden; word-wrap: break-word; }

.diet-ball:hover .icon { color: #dd6666; }

.diet-ball .icon { width: 58px; height: 58px; border-radius: 90px; font-size: 38px; line-height: 65px; color: #acacac; margin: 0 auto; border: 1px solid #333333; background: rgba(255, 255, 255, 0.7); }

.diet-ball span { padding-top: 0.9em; display: block; line-height: 1.2em; font-family: "abril-display", georgia, serif; text-transform: none; font-size: 12px; }

.active .diet-ball .icon, .active .diet-ball:hover .icon { color: #B52828; }

#menu-slider { display: none; width: 100%; cursor: pointer; background: #B52828; color: #fff; text-align: center; font-family: 'proxima-nova'; font-size: 13px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; height: 35px; line-height: 35px; box-sizing: border-box; }

#menu-slider.slider-active, #menu-slider:hover { background: #611616; }

#menu-slider span.slider-inactive:after { content: ' \f105'; font-family: 'FontAwesome'; font-size: 1.4em; margin-left: 10px; position: relative; bottom: -0.08em; }

#menu-slider span.slider-active:before { content: '\f104 '; font-family: 'FontAwesome'; font-size: 1.4em; font-size: 1.4em; margin-right: 10px; position: relative; bottom: -0.08em; margin-right: 10px; position: relative; bottom: -0.08em; }

#meal-diets-menu { font-size: 0; margin-bottom: 10px; }

#meal-diets-menu a { text-align: center; background: #ececec; border-top: 3px solid #acacac; width: 50%; padding: 0 0 12px; display: inline-block; }

#meal-diets-menu a:hover { background: #dfdfdf; }

#meal-diets-menu a.active { border-top: 3px solid #7698AD; background: #fff; }

.checklist a { display: block; font-family: 'proxima-nova'; border-bottom: 1px solid #acacac; font-size: 0.88em; font-weight: 600; color: #444; padding: 8px 30px 8px 3.25em; line-height: 20px; text-transform: uppercase; position: relative; }

.checklist a:hover, .checklist a:active { color: #444; }

.checklist a.parent:after { content: ' \f078'; font-family: 'FontAwesome'; font-size: 11px; margin-left: 10px; position: absolute; right: 5px; color: #ababab; }

.checklist a:not(.parent):after { content: '\f067'; font-family: 'FontAwesome'; display: inline-block; position: absolute; right: 0; width: 22px; background: #efefef; color: #ababab; height: 22px; line-height: 22px; text-align: center; border-radius: 50px; transition: 0.2s all ease; }

.checklist a:not(.parent):hover:after { background: #7698AD; color: #fff; }

.checklist a:not(.parent).active:after { content: '\f00c'; background: #7698AD; color: #fff; }

.checklist .checklistChild a { border-bottom: none; border-top: 1px solid #acacac; font-weight: normal; text-transform: none; }

.checklist .checklistChild a:first-child { border-top: none; }

.checklist a:last-child, #main-ingredients > a:last-of-type { border-bottom: none; }

#advanced_search .tag { display: inline-block; margin: 0 7px 7px 0; background: #7698AD; color: #fff; padding: 6px 10px; font-family: 'proxima-nova'; text-transform: uppercase; letter-spacing: 0.05em; font-size: 13px; cursor: pointer; }

#advanced_search .tag:hover, #advanced_search .tag.active, #advanced_search .tag.selected { background: #476476; color: #fff; }

#season_festivities { border-top: 1px solid #acacac; border-bottom: 1px solid #acacac; padding: 10px 0; }

#seasons-and-themes div { padding: 10px 0.95em; }

#seasons-and-themes div:last-child { border-bottom: none; }

#seasons-and-themes p { font-family: "abril-display", georgia, serif; font-style: italic; font-size: 16px; margin-bottom: 10px; }

/*#recipe-difficulty { display: block; margin: 0px auto 16px; overflow: hidden; padding: 5px 0px; } #recipe-difficulty .diet-ball { height: 70px; padding-top: 10px; }*/
.caret.caret-upside { border-top-width: 0; border-bottom: 4px solid #000; }

#docs { width: 100%; float: left; padding-top: 20px; font-size: 0; }

.grid-item .recipe-menu { display: none; }

.relative { position: relative; }

.mobile-toolbar { display: none; }

@media screen and (max-width: 1024px) { .widgetBox, #docs { width: 100%; } }

@media screen and (max-width: 955px) { #docs { padding-top: 0; }
  #advanced_search { margin-top: 0 !important; }
  #menu-slider { display: block; }
  .widgetbox-container { width: 350px; display: none; z-index: 8; position: absolute; background: white; top: 97px; left: 0; box-shadow: rgba(0, 0, 0, 0.25) 5px 3px 10px; -o-box-shadow: rgba(0, 0, 0, 0.25) 5px 3px 10px; -moz-box-shadow: rgba(0, 0, 0, 0.25) 5px 3px 10px; -webkit-box-shadow: rgba(0, 0, 0, 0.25) 5px 3px 10px; }
  #advanced_search .left-col, #advanced_search .right-col { width: 100%; float: none; padding: 0; }
  #category .searchParams { width: 100%; }
  #menu-slider { width: 42%; float: left; font-size: 1em; }
  .desktop-button { display: none; }
  .mobile-toolbar { position: fixed; display: none; bottom: 0; left: 0; width: 100%; font-size: 0; z-index: 9; background: #7698AD; text-align: center; overflow: hidden; }
  .mobile-toolbar.show { display: block; }
  .mobile-toolbar a { padding: 12px 5px; vertical-align: middle; border-left: #fff 1px solid; display: inline-block; text-transform: uppercase; font-size: 13px; letter-spacing: 0.05em; color: #fff; font-weight: 800; width: 50%; line-height: 1.3; box-sizing: border-box; -mox-box-sizing: border-box; -webkit-box-sizing: border-box; font-family: 'proxima-nova'; }
  .mobile-toolbar a:hover, .mobile-toolbar a:active { color: #fff; }
  .mobile-toolbar a:first-child { border-left: none; }
  .mobile-toolbar a > span { color: #333333; display: block; }
  .search-header { padding-bottom: 10px; overflow: hidden; } }

@media screen and (max-width: 350px) { #load-more-btn { width: 100%; margin: 15px auto; }
  #inner-wrapper { width: 100%; margin: 0; }
  .widgetbox-container { width: 100%; top: 104px; border: none; box-shadow: none; }
  .widgetBox { padding: 0; }
  .ui-menu-item { /*height: 32px;*/ font-size: 15px !important; padding: 13px 10px !important; }
  .search-header { padding: 30px 0 20px; background: #fff; position: relative; z-index: 5; overflow: hidden; margin-top: -18px; }
  .overlay-dark { display: none; position: fixed; height: 100%; top: 0; bottom: 0; left: 0; right: 0; width: 100%; background: rgba(0, 0, 0, 0.6); z-index: 3; } }

@media only screen and (max-device-width: 480px) { #advanced_search .solr-searchbar .search-input { border-right: 1px solid #c2c2c2; width: 100%; margin-bottom: 10px; } }

/* * * Kotiliesi - Single recipe page template styles Table of contents ----------------- recipe title recipe toolbar info bar share buttons recipe excerpt recipe columns */
.main-content { position: relative; }

/* RECIPE HEADER */
.recipe-header { position: relative; z-index: 0; overflow: hidden; }

.recipe-header .article__title { font-size: 30px; margin: 0; text-overflow: ellipsis; overflow: hidden; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }

.recipe-header .overlay { padding: 20px 0; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.recipe-header .recipe-image { width: 100%; }

.lukijan .author-group-icon { position: absolute; top: 5%; right: 5%; z-index: 2; width: 17%; }

.lukijan .author-group-icon.no-img { position: absolute; top: 0; right: 3.5%; width: 50px; }

/*.lukijan h1.recipe-title.no-img { padding-right: 60px; }*/
/* RECIPE TAGS */
.tag-row ul { margin-left: 35px; margin-bottom: 15px; list-style-type: none; }

.tag-row ul:before { display: block; width: 30px; height: 30px; line-height: 30px; text-align: center; color: #ccc; font-size: 25px; margin-left: -35px; float: left; }

.tag-row ul li { display: inline-block; }

/* headings */
.recipe-column h2 { padding-bottom: 4px; border-bottom: 1px solid #ccc; margin-bottom: 10px; }

.ingredients h3 { font-family: 'proxima-nova'; color: #B52828; text-transform: uppercase; font-size: 0.9em; margin-top: 12px; font-weight: 400; margin-bottom: 0; }

.recipe-toolbar { font-family: 'proxima-nova'; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; font-size: 0; margin-bottom: 25px; overflow: hidden; text-align: center; }

.recipe-toolbar > div { display: inline-block; vertical-align: top; height: 50px; margin-right: 20px; font-size: initial; position: relative; line-height: 50px; overflow: hidden; font-size: 11px; font-weight: 600; text-transform: uppercase; text-align: center; box-sizing: border-box; }

.recipe-toolbar > div:before { color: #7698AD; font-size: 15px; margin-right: 2px; }

.recipe-toolbar > div:last-of-type { margin-right: 0; padding-right: 0; }

.recipe-toolbar a { color: #B52828; }

/*.recipe-toolbar .toolbar-buttons{ font-size: 17px; float:right; ul {  position: relative; padding-right: 40px; li { display: inline-block; vertical-align: middle; a { display: block; height:30px; width: 30px;  background: $secondaryColor; color: #fff; line-height: 34px; border-radius: 500px; text-align: center; margin-right: 5px; &:before { } } &.toggle { position:absolute; top: 11px; right: 5px; } } } }*/
/* Rating widget */
#recipe-rating .rw-action-area { margin-top: -5px !important; }

#recipe-rating .rw-ui-info-container, #recipe-rating .rw-report-link { visibility: hidden !important; width: 0 !important; position: absolute; }

.highlight-text { color: #7698AD; font-size: 1.97em; position: relative; bottom: -0.15em; margin-top: -0.5em; margin-right: 0.2em; display: inline-block; font-weight: 400; }

/* recipe-excerpt */
.recipe-excerpt { margin-bottom: 25px; font-size: 1.3em; font-weight: 600; color: #303030; }

/* RECIPE COLUMNS */
.recipe-column { width: 50%; margin-bottom: 25px; float: left; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */ /* Firefox 1 - 28 */ box-sizing: border-box; /* Safari 5.1+, Chrome 10+, Firefox 29+, Opera 7+, IE 8+, Android 4.0+, iOS any */ }

.recipe-column:nth-child(even) { padding-left: 10px; }

.recipe-column:nth-child(odd) { padding-right: 10px; }

.recipe-columns-lower { border-top: 1px solid #ccc; padding-top: 14px; margin-bottom: -20px; }

/* INGREDIENT ROW  */
.ingredients { margin-bottom: 20px; }

.ingredient-row { padding: 8px 36px 6px 0; width: 100%; white-space: nowrap; cursor: pointer; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */ /* Firefox 1 - 28 */ box-sizing: border-box; }

.ingredient-row span { display: inline-block; vertical-align: top; white-space: initial; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */ /* Firefox 1 - 28 */ box-sizing: border-box; }

.ingredient-row span.ingredient-quantity { width: 30%; padding-right: 5px; }

.ingredient-row span.ingredient-name { width: 70%; }

.ingredient-row:after { content: '\f067'; font-family: 'FontAwesome'; display: inline-block; right: 0; width: 22px; background: #efefef; color: #ababab; height: 22px; line-height: 22px; text-align: center; border-radius: 50px; transition: 0.2s all ease; }

.ingredient-row.selected:after { content: '\f00c'; background: #7698AD; color: #fff; }

.ingredient-row:hover:after { background: #7698AD; color: #fff; }

.ingredient-row.selected:hover:after { content: '\f00c'; }

.ingredient-section { font-size: 14px; }

.icon-i-kello2:before { display: inline-block; height: 18px; width: 18px; border-radius: 50%; border: 1px solid #B52828; text-align: center; line-height: 16px; font-size: 23px; color: #B52828; }

/*.recipe-mobile-toolbar { margin-top: -1.57rem; margin-bottom: 15px; display:none; height: 0; position:relative; z-index: 1; font-size: 20px; }*/
/*#recipe-buttons-blue .button, #recipe-buttons-blue .wpfp-link { margin-right: 4px; margin-bottom: 8px; }*/
#recipe-buttons-blue { text-align: center; }

#recipe-buttons-blue .button:before, #recipe-buttons-blue .wpfp-link:before { margin-right: 5px; }

#recipe-buttons-blue .wpfp-link:before { content: "\f004"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); transform: translate(0, 0); }

#recipe-buttons-blue .wpfp-span { display: inline-block; margin-bottom: 12px; }

#recipe-buttons-blue .wpfp-span img { display: none !important; }

/*#recipe-buttons-blue .wpfp-link { border: 1px solid #03acc8; border-radius: 3px; text-transform: uppercase; cursor: pointer; display: inline-block; text-align: center; font-size: 0.8rem; letter-spacing: 0.03rem; padding: 8px 10px; color: #03acc8; line-height: 1; } #recipe-buttons-blue .wpfp-link:hover { color: #fff; background: #03acc8; }*/
.toolbar-button:before, .recipe-rating .fa-star:before { font-size: 1.55em; position: relative; bottom: -0.1em; }

@media screen and (max-width: 660px) { .lukijan .author-group-icon { top: 42px; width: 50px; }
  /*.lukijan h1.recipe-title { padding-right: 70px; } h1.recipe-title.no-img { border-bottom: 1px #ccc solid; margin: 10px 0 40px; padding: 0 3.5% 30px; }*/
  /*.recipe-image{ border-bottom: 2px solid #03acc8; margin-bottom: 0; } .recipe-mobile-toolbar { display: block; height: auto; } .recipe-toolbar .toolbar-buttons { display: none; height: 0; } .hide-extra.additional-toolbar li { display: list-item; } .hide-extra.additional-toolbar li.m { display: none; }*/
  /*.recipe-toolbar, .recipe-meta { border-bottom: none; }*/
  /*.recipe-toolbar > div { width: 33.33%; border-bottom: 1px solid #ccc; text-align: center; }*/
  /*.recipe-toolbar.two-data-boxes > div { width: 50%; }*/
  /*.recipe-meta > div { width: 50%; border-bottom: 1px solid #ccc; text-align: center; border-top: none!important; } .recipe-meta > div:first-child { width: 100%; } .recipe-meta div:last-child:nth-child(even) { width: 100%; }*/
  .recipe-column, .recipe-column:nth-child(odd), .recipe-column:nth-child(even), .recipe-excerpt { width: 100%; float: none; padding: 0 10% 25px; border-bottom: 1px solid #ccc; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
  .recipe-tags { padding: 0 10% 25px; }
  #recipe-buttons-blue { text-align: center; }
  .instructions h2, .recipe-tags h2 { border-bottom: none; }
  .ingredient-row { border-bottom: 1px solid #ccc; }
  #recipe-buttons-blue { padding-top: 0; border-top: none; } }

@media screen and (max-width: 560px) { .recipe-toolbar { text-align: center; }
  .recipe-toolbar .toolbar-buttons { float: none; width: 100%; }
  .article__aftercontent--somebar, .article__aftercontent--byline { text-align: center; } }

@media screen and (max-width: 390px) { .recipe-meta > div { width: 100%; }
  /*h1.recipe-title { font-size: 1.7em; }*/
  .author-group-icon { width: 56px; top: 38px; }
  /*h1.recipe-title.no-img { font-size: 1.9em; }*/ }

#ostoslista .shopping-list-group { margin-bottom: 30px; overflow: hidden; }

#ostoslista .shopping-list-group h2 { padding-bottom: 4px; border-bottom: 1px solid #ccc; margin-bottom: 10px; color: #444; }

#ostoslista .shopping-list-group h3 { font-family: 'proxima-nova'; color: #B52828; text-transform: uppercase; font-size: 13px; margin-top: 12px; font-weight: 400; margin-bottom: 0; }

#ostoslista .shopping-list-group ul { list-style-type: none; padding: 0; margin-bottom: 10px; margin-left: 0; }

#ostoslista .shopping-list-group ul .ingredient-row:after { display: none; }

#ostoslista .shopping-list-group .source-link { float: right; }

#ostoslista button { margin-right: 10px; }

.bchallenge__container .grid-item__bg { border: none; cursor: pointer; }

.bchallenge__item { position: relative; }

.bchallenge__item:after { content: 'Ã?Ã¤nestÃ¤!'; display: block; width: 60px; height: 60px; background: #fff; color: #000; border-radius: 500px; text-align: center; line-height: 60px; position: absolute; right: 5px; top: 5px; pointer-events: none; font-family: "abril-display", georgia, serif; font-weight: 600; font-style: italic; letter-spacing: 0.03em; font-size: 12px; box-shadow: 1px 0 6px rgba(0, 0, 0, 0.23); transition: all 0.2s ease; }

.bchallenge__item:hover:after { background: #000; color: #fff; }

.bchallenge__item--recipelink { font-size: 17px; float: right; margin-top: 12px; }

.bchallenge__item--source { font-family: 'proxima-nova'; text-transform: uppercase; font-weight: 600; font-size: 13px; display: block; margin: 15px 0 10px; }

.bchallenge__item label { margin: 0; }

.bchallenge__item h3 { line-height: 1.2em; }

a { color: #B52828; transition: color 0.3s ease; }

a:visited { color: #B52828; }

a:hover, a:active, a:focus { color: #611616; }

p { font-size: 20px; line-height: 1.25; }

h1, h2, h3, h4, h5, h6 { font-family: "abril-display", georgia, serif; font-weight: 700; }

h1 { font-size: 28px; color: #444; line-height: 1.2em; clear: both; font-weight: 800; }

h2.block-header { text-transform: uppercase; text-align: center; font-size: 15px; line-height: 1.25; letter-spacing: 0.01em; font-family: 'proxima-nova'; }

h2.block-header:after { display: block; content: ''; width: 35px; height: 1px; background: #222; margin: 5px auto 10px; }

h2 { font-size: 23px; line-height: 1.4em; }

h3 { font-size: 20px; line-height: 1.4em; }

h4 { line-height: 1.1; font-size: 16px; margin-bottom: 10px; }

h5 { font-weight: 700; font-size: inherit; }

body { font-family: "chaparral-pro", Arial, Geneva, sans-serif; color: #444; font-weight: 400; font-size: 13px; }

strong { font-weight: bold; }

.widget-area h3 { font-family: "abril-display", georgia, serif; font-weight: 400; font-size: 18px; line-height: 1.18; }

.widget-area a h3 { color: #444; }

.typogr__meta { font-family: 'proxima-nova'; text-transform: uppercase; font-weight: 700; font-size: 12px; letter-spacing: 0.03em; color: #dadfe1; }

.typogr__breadcrumb { font-family: "chaparral-pro", Arial, Geneva, sans-serif, sans-serif; font-weight: 600; font-size: 14px; letter-spacing: 0.03em; color: #B52828; }

.typogr__breadcrumb a, .typogr__breadcrumb a:visited { color: #611616; }

.typogr__breadcrumb a:hover, .typogr__breadcrumb a:visited:hover { color: #611616; text-decoration: underline; }

.typogr__tab { font-family: "chaparral-pro", Arial, Geneva, sans-serif, sans-serif; font-weight: 300; font-size: 14px; letter-spacing: 0.03em; }

.typogr__catlink { font-family: "chaparral-pro", Arial, Geneva, sans-serif, sans-serif; font-weight: 600; font-size: 14px; }

.typogr__taglink { font-family: "abril-display", georgia, serif; font-size: 17px; display: inline-block; color: #B52828; margin: 0 15px 5px 0; text-transform: lowercase; /* font-weight: 600; */ letter-spacing: 0.02em; font-style: italic; }

.typogr__taglink:hover, .typogr__taglink:active { color: #611616; }

.typogr__taglink:visited { color: #B52828; }

.typogr__showmorebtn { font-family: "chaparral-pro", Arial, Geneva, sans-serif, sans-serif; font-size: 14px; text-transform: uppercase; color: #B52828; letter-spacing: 0.07em; transition: all 0.3s ease; font-weight: 600; }

.typogr__showmorebtn:visited { color: #B52828; }

.typogr__showmorebtn:hover { color: #611616; }

.login__container { font-size: 16px; line-height: 19px; }

.article__somebar { float: right; }

.article__precontent { line-height: initial; margin-bottom: 25px; }

.article__precontent > div { display: inline-block; }

.article__precontent--catcontainer { color: #B52828; margin-right: 10px; font-weight: 600; text-transform: uppercase; font-family: 'proxima-nova'; }

.article__precontent--catcontainer a:after { content: ' | '; }

.article__precontent--catcontainer a:last-of-type:after { content: ''; }

.article__precontent--date { font-weight: 600; }

.article__title { font-size: 28px; line-height: 1.3; margin: 10px 0 30px; }

.article__ingress { font-size: 18px; line-height: 24px; margin-bottom: 15px; }

.article__body { clear: both; padding-bottom: 25px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; font-size: 20px; line-height: 1.25; }

.article__body iframe { width: 100% !important; }

.article__body img { max-width: 100%; height: auto !important; margin: 20px 0 10px; }

.article__body p { margin-bottom: 20px; }

.article__body h2 { font-size: 21px; }

.article__body h3 { margin-bottom: 15px; margin: 30px 0 10px; }

.article__body h5 { font-weight: 400; font-size: 17px; }

.article__body h5 strong { font-weight: inherit; font-family: inherit; font-size: inherit; }

.article__body table { margin-bottom: 20px; }

.article__body table td, .article__body table th { padding: 10px; text-align: left; }

.article__body table th { text-transform: uppercase; font-size: 14px; }

.article__body table tr { border-top: 1px solid #ccc; }

.article__body table tr:first-child { border: none; }

.article__aftercontent--somebar { margin: 0 auto 30px; }

.article__aftercontent--tags { border-top: 1px solid #ccc; padding-top: 14px; padding-bottom: 10px; }

.article__aftercontent--tags h2 { /*display:inline; margin-right: 20px; font-size: 18px;*/ }

.article__aftercontent--tags ul { display: inline-block; }

.article__aftercontent--tags ul li { display: inline; }

.article__aftercontent--byline { font-family: 'proxima-nova'; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 13px; text-transform: uppercase; padding: 5px 0; margin-bottom: 15px; }

.article__aftercontent--byline > div { display: inline-block; margin: 5px 5% 5px 0; }

.article__aftercontent--byline > div:last-of-type { margin-right: 0; }

.article__aftercontent--byline .fa { color: #ccc; font-size: 1.8em; vertical-align: -8%; margin-right: 10px; }

.article-sidestory, .kainalo { padding: 25px; background: #f2f0f1; box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; margin-bottom: 20px; }

.article-sidestory p, .kainalo p { margin-bottom: 20px; }

.article-sidestory h2, .kainalo h2 { font-size: 21px; }

.article-sidestory h2:first-letter, .kainalo h2:first-letter { font-size: 36px; }

.menucard { text-align: center; }

.menucard h3 { color: #B52828; }

.menucard a { color: #444; }

.article__body .oikea { float: right; clear: right; margin: 0 0 10px 15px; }

.article__body .vasen { float: left; clear: left; margin: 0 15px 10px 0; }

.article-category a { padding: 7px 5px; line-height: 14px; font-size: 14px; }

@media screen and (max-width: 768px) { .article__precontent { margin-bottom: 10px; }
  .review__box { padding: 10px 15px 10px; } }

@media screen and (max-width: 640px) { .article__aftercontent--tags { width: 100%; }
  .article__somebar { float: none !important; margin: 0; padding: 0; padding-top: 20px; width: 100%; text-align: center; }
  .article__somebar ul li { display: inline-block; float: none !important; margin-left: 0px; margin-right: 10px; }
  .article__somebar ul span { display: none; } }

@media screen and (max-width: 480px) { .article__precontent { margin-bottom: 10px; }
  .article__title { font-size: 25px; } }

blockquote.quote { background: #3A4249; border-left-color: #23282d; }

.comment__avatar, .comment__content { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.comment-container > .comment:first-of-type > .comment__wrapper { border-top: 0; }

.comment > .comment { margin-left: 68px; }

.comment__avatar { float: left; width: 56px; }

.comment__avatar img { border-radius: 50%; }

.comment__wrapper { border-top: 1px solid #dadfe1; padding-top: 15px; margin: 15px 0; font-size: 15px; }

.comment__meta { color: #444; font-weight: normal; margin-bottom: 10px; }

.comment__meta--time { margin-right: 5px; }

.comment__meta--author { font-weight: 700; }

.comment__meta--edit-link { float: right; font-family: 'proxima-nova'; }

.comment__content { padding-left: 68px; line-height: 20px; }

.child-comments .comment__wrapper { padding-left: 8%; }

a.comment-reply-link { color: #B52828; }

.commentform__login .button { margin-right: 10px; }

.commentform .comment-form-comment textarea { width: 100%; }

.box { float: left; width: 100%; box-sizing: border-box; overflow: hidden; margin-bottom: 20px; }

.box--full { margin-bottom: 20px; }

.box--half { width: 49%; float: left; box-sizing: border-box; overflow: hidden; margin-bottom: 20px; }

.box--half__spacer { content: ''; display: block; float: left; width: 1px; height: 10px; background-color: transparent; margin-left: calc(1% - 1px); margin-right: calc(1% - 1px); }

#sivupalkki .box--half { width: 100%; margin-right: 0; margin-left: 0; /*background: rgba(0,0,0,0.9); padding:0; .widget-feed ul{ .feed__item--category{ padding:0 10px; } .feed__item--date{ padding:0 10px; } .feed__item h3{ padding:0 10px; } }*/ }

#sivupalkki .box--half:nth-child(odd) { padding-right: 0; border-right: none; }

@media screen and (max-width: 480px) { .box--half { width: 100%; height: auto !important; }
  .box--half__spacer { display: none; } }

ul.list { margin-bottom: 20px; }

ul.list .side-image { height: auto; width: 20%; }

.om-grid-container .om-grid { margin: 0; }

.gridWidget-postContainer { font-size: 0; }

.widget-area, .gridWidget-postContainer { overflow: visible; }

.widget-area:after, .gridWidget-postContainer:after { content: ''; display: block; clear: both; }

.navtabs { background: transparent; }

.navtabs li { position: relative; background: transparent !important; }

.navtabs li a { color: #444; font-family: 'proxima-nova'; font-weight: 800; letter-spacing: 0.03em; font-size: 13px; }

.navtabs li:after { content: ''; display: block; height: 50%; width: 1px; background: #ccc; position: absolute; vertical-align: middle; top: 25%; right: -1px; z-index: 2; }

.navtabs li.active a { color: #B52828; }

.grid__container { clear: both; }

.grid__container .button { float: right; }

.grid-item { font-size: 13px; padding-bottom: 0; float: none; }

.grid-item.sponsored .grid-item__bg:before { content: 'Mainos'; position: absolute; right: 10px; top: 10px; display: inline-block; background: #fff; border-radius: 3px; color: #444; font-style: italic; padding: 7px; margin-bottom: 15px; font-family: "abril-display", georgia, serif; font-weight: 600; letter-spacing: 0.03em; box-shadow: 1px 0 6px rgba(0, 0, 0, 0.23); z-index: 1; }

.grid-item .grid-icon { color: #7698AD; font-size: 1.5em; position: relative; bottom: -0.13em; margin-right: 0.25em; margin-left: 0.1em; }

.grid-item .grid-recipe-detail { font-family: 'proxima-nova'; font-size: 12px; margin-top: 0.35em; margin-right: 1.15em; display: inline-block; letter-spacing: 0.03em; text-transform: uppercase; }

.grid-item:hover .grid-item__bg:after { background: rgba(0, 0, 0, 0.2); }

.grid-item:hover .grid-item-blogs__overlay { background: #fff; }

.grid-item__bg { height: 0; padding-bottom: calc(100% - 30px); background-repeat: no-repeat; background-size: cover; position: relative; background-position: center; box-shadow: 1px 2px 4px 0px rgba(101, 101, 101, 0.25); border: 15px solid #FDF9EE; }

.grid-item__bg:after { content: ''; display: block; background: none; position: absolute; height: 100%; top: 0; left: 0; width: 100%; }

.grid-item__content { position: static; padding: 5px 0 0; }

.grid-item__content h2 { line-height: 1.3; font-size: 1.615em; padding-top: 25px; text-overflow: ellipsis; overflow: hidden; margin: 0 0 10px 0; color: #444; }

.grid-item__content p { color: #444; }

.grid-item__content--cats { font-family: "abril-display", georgia, serif; }

.grid-item__content .meta { margin-bottom: 2px; }

.grid-item__catbutton { margin-right: 5px; }

.grid-item__excerpt { font-size: 20px; line-height: 1.25; margin-bottom: 7px; color: #444; }

.grid--fourArticles .meta { margin-bottom: 2px; display: block; }

.grid--fourArticles .author a { letter-spacing: 1px; color: #B52828; margin-bottom: 5px; display: block; line-height: 1.3; }

.blogauthor-overlay { position: relative; }

.blogauthor-overlay a { position: absolute; display: block; top: -35px; background: #B52828; color: #fff; padding: 0 20px 0 5px; text-transform: uppercase; height: 26px; line-height: 26px; }

.blogauthor-overlay a:after { width: 0; content: ''; height: 0; border-top: 13px solid #B52828; border-bottom: 13px solid #B52828; border-right: 15px solid transparent; position: absolute; right: -15px; top: 0; }

.om-grid .bgimg { background-position: center center; background-repeat: no-repeat; background-size: cover; background-color: #ebebeb; position: relative; width: 100%; padding-bottom: 100%; }

.om-grid-container .om-grid > li { margin-bottom: 30px; }

.blogauthor-overlay { position: relative; }

.blogauthor-overlay a { position: absolute; display: block; top: -35px; background: #B52828; color: #fff; padding: 0 20px 0 5px; text-transform: uppercase; height: 26px; line-height: 26px; }

.blogauthor-overlay a:after { width: 0; content: ''; height: 0; border-top: 13px solid #B52828; border-bottom: 13px solid #B52828; border-right: 15px solid transparent; position: absolute; right: -15px; top: 0; }

.grid-item-blogs .grid-item__bg { border: none; padding-bottom: 100%; }

.grid-item-blogs__overlay { background: #fff; width: 85%; margin: 0 auto 0; position: relative; top: -35px; text-align: center; box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.3); }

.grid-item-blogs__overlay--posttitle { width: 100%; display: block; padding: 5px 10px; box-sizing: border-box; }

.grid-item-blogs__overlay--posttitle h2 { padding-top: 12px; }

.grid-item-blogs__overlay--bloglink { display: block; padding: 5px; padding-top: 0; width: 100%; box-sizing: border-box; text-align: right; font-family: "abril-display", georgia, serif; font-style: italic; font-size: 16px; color: #B52828; }

.grid-item-blogs__overlay--bloglink:visited { color: #B52828; }

.grid-item-blogs__overlay--bloglink:hover, .grid-item-blogs__overlay--bloglink:visited:hover { color: #611616; }

.block-item { width: 100%; position: relative; font-size: 13px; }

.block-item-panel { right: 0; top: 10%; height: auto; width: 46%; background-color: #FFF; background-repeat: no-repeat; background-size: cover; position: absolute; -ms-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.3); -o-box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.3); box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.3); padding: 25px; }

h2.block-item-header { font-weight: normal; font-family: "abril-display", georgia, serif; height: auto; line-height: 1.3; text-transform: none; font-size: 1.615em; text-overflow: ellipsis; overflow: hidden; margin: 0 0 0.6em 0; color: #444; }

.block-item-excerpt { font-size: 1.077em; line-height: 1.45em; margin-bottom: 20px; color: #222; }

.block-item-a { color: #B52828; position: absolute; bottom: 18px; right: 25px; }

.block-item-meta { font-size: 12px; color: #959595; position: absolute; bottom: 18px; left: 25px; }

.block-item:hover .grid-item .bg:after { background: rgba(0, 0, 0, 0.2); }

.sidebar-posts li, li.grid-template_sidebar { border-bottom: 1px solid #efefef; padding: 15px 0; overflow: hidden; margin-bottom: 0 !important; }

.sidebar-posts li img, li.grid-template_sidebar img { margin-left: 0; float: left; width: 30%; height: auto; }

.sidebar-posts li h3, .sidebar-posts li p, li.grid-template_sidebar h3, li.grid-template_sidebar p { margin-left: calc(30% + 17px); color: #444; float: none; }

/* Media queries */
@media screen and (max-width: 768px) { .bg-wrapper { display: block; width: 100%; max-width: 400px; margin: 0 auto 25%; }
  .block-item-panel { position: relative; margin: -30% auto 10%; max-width: 400px; width: 80%; right: auto; bottom: auto; } }

#topbar { background: #fff; box-shadow: 0 0 10px rgba(50, 50, 50, 0.2); }

.topbar__logo { background: url("assets/img/ruokafi_logo.png") no-repeat center left; width: 130px; margin-right: 0; background-size: 90%; height: 48px; }

#mobile-navigation__button { color: #7698AD; background-color: transparent; }

#mobile-navigation__search { color: #7698AD; background-color: transparent; }

#navigation--mobilebuttons a { background-color: #383838; width: calc(100% / 2); border-right: 1px solid #939393; color: #d6d6d6; font-family: 'proxima-nova'; }

.navi { font-family: 'proxima-nova'; font-weight: 600; letter-spacing: 0; }

.navi > li { padding: 0; }

.navi > li:hover { background: transparent; }

.navi > li:hover > a { color: #7698AD; }

.navi > li:before { display: none; }

.navi > li:first-child:before { display: none; }

.navi > li a { font-weight: 800; letter-spacing: 0.03em; padding: 0 8px; font-size: 13px; }

.navi > li.menu-item-has-children a { padding-right: 15px; }

.navi > li.menu-item-has-children:after { right: 3px; }

.navi > li.current-menu-parent > a, .navi > li.current-menu-item > a, .navi > li.current-menu-ancestor > a { color: #7698AD; }

.navi li { font-family: 'proxima-nova'; color: #444; }

.navi li a { color: #444; }

.navi li .sub-menu { background: #fff; }

.navi li .sub-menu li { color: #404146; border-bottom: 1px solid #dadad8; padding: 0; }

.navi li .sub-menu li:before { content: none; }

.navi li .sub-menu li:last-child { border-bottom: none; }

.navi li .sub-menu li:hover, .navi li .sub-menu li.current-menu-parent, .navi li .sub-menu li.current-menu-item, .navi li .sub-menu li.current-menu-ancestor { background: #ccc; }

.navi li .sub-menu li a { padding: 8px; background: transparent; font-weight: 400; font-size: 1.1em; letter-spacing: 0.03em; text-transform: none; line-height: 1.5; }

.navi li:hover > .sub-menu { margin-left: 0; }

.navi__magazine { background: transparent; font-family: "chaparral-pro", Arial, Geneva, sans-serif; text-transform: none; height: 42px; font-weight: 600; color: #444; }

.navi__magazine:visited { color: #444; }

.navi__search--button { color: #444; font-size: 1.5rem; margin-left: 1.23rem; line-height: 48px; }

.navi__user { color: #444; font-size: 1.5rem; margin-left: 1.23rem; line-height: 48px; }

.navi__user.active { color: #B52828; }

@media screen and (max-width: 1023px) { #topbar { box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.1); }
  #mobile-scroll { background: rgba(0, 0, 0, 0.7); }
  .topbar__logo { height: 42px; left: calc(50% - 65px); }
  #topbar .navi { background: rgba(62, 69, 76, 0.85); }
  #topbar .navi li { color: #000; border-bottom: 1px solid #aaaaaa; color: #333; }
  #topbar .navi li a { padding: 0; color: inherit; }
  #topbar .navi li.menu-item-has-children > a { background-size: 8px; }
  #topbar .navi li.menu-item-has-children.open > a { background-size: 14px; }
  #topbar .navi li .sub-menu { border-top: 3px solid #B52828; font-size: 16px; }
  #topbar .navi li .sub-menu li { background: #ebebeb; }
  #topbar .navi li .sub-menu li:last-child { border-bottom: none; }
  #topbar .navi li .sub-menu li a { font-weight: normal; text-transform: none; }
  #topbar .navi .navi__magazine { margin-left: 20px; }
  #navigation--secondary a { background: #ddd; border-bottom: 1px solid #aaaaaa; color: #333; } }

#sitewide-searchbar-container .sitewide-searchbar .search-submit-button { background: #B52828; color: #fff; letter-spacing: 0.07em; font-weight: 600; font-size: 14px; font-family: "chaparral-pro", Arial, Geneva, sans-serif, sans-serif; }

#sitewide-searchbar-container .sitewide-searchbar .search-submit-button:hover, #sitewide-searchbar-container .sitewide-searchbar .search-submit-button:focus { background: #333; color: #fff; }

#sivupalkki .om-grid-container { margin-bottom: 30px; }

.slick-initialized .slick-slide { outline: none; }

.carousel-item--body { padding: 0; bottom: 43%; right: 0; left: 0; width: 100%; background: none; text-align: center; }

.carousel-item--body h2 { font-size: 1.7em; line-height: 1.2em; color: #fff; font-style: italic; font-weight: 600; font-family: "abril-display", Arial, Geneva, sans-serif; letter-spacing: 0.01em; display: inline-block; background: #000; max-width: 85%; letter-spacing: 0.02em; padding: 9px 14px 7px; margin: 0; /* text-transform: uppercase; */ }

.carousel-item--cat { position: absolute; top: 20px; background: #B52828; color: #fff; padding: 8px 16px 8px 30px; text-transform: uppercase; letter-spacing: 2px; font-size: 15px; z-index: 1; }

.carousel-item--cat:visited, .carousel-item--cat:active, .carousel-item--cat:hover { color: #fff; }

.slick-dots li, .slick-dots li button, .slick-dots li button { height: 12px; width: 12px; }

.slick-dots li { margin-left: 10px; }

.slick-dots li.slick-active button { background: #B52828; }

.slick-dots li button { background: #fff; border-radius: 500px; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.25) .slick-dots li button; }

.slick-dots li button :before { content: none; }

.uutiskirje > p { font-size: 1.077em; margin-top: -5px; }

.uutiskirje input[type=email], .uutiskirje button[type=submit] { display: inline-block; height: 36px; box-sizing: border-box; vertical-align: top; }

.uutiskirje input[type=email] { width: 73%; }

.uutiskirje button[type=submit] { width: 25%; }

.widget-imgButton { text-align: center; }

.widget-feed { margin-bottom: 20px; }

.widget-feed input { width: 100%; }

.sidebar-block { margin-bottom: 30px; }

#tilaa-seuraa .links { font-family: "chaparral-pro", Arial, Geneva, sans-serif; color: #444; font-size: 13px; font-weight: normal; }

#tilaa-seuraa .some a { color: #fff; background: #B52828; display: inline-block; margin-left: 6px; border-radius: 100px; text-align: center; transition: 0.3s background ease; }

#tilaa-seuraa .some a.fa { font-size: 17px; line-height: 27px; height: 27px; width: 27px; padding: 0; }

#tilaa-seuraa .some a:hover { background: #8b1f1f; }

.sisaltoyhteistyo-widget .itemlist { font-size: 0; }

.sisaltoyhteistyo-widget .itemlist li { width: 49%; margin-right: 1%; margin-bottom: 15px; vertical-align: top; display: inline-block; font-size: 13px; }

.sisaltoyhteistyo-widget .itemlist li:nth-child(even) { margin-right: 0; margin-left: 1%; }

.sisaltoyhteistyo-widget .itemlist li img { display: block; margin: 0 auto; }

#sivupalkki .sisaltoyhteistyo-widget .itemlist li { width: 100%; margin-left: 0; margin-right: 0; }

@media (max-width: 525px) { .sisaltoyhteistyo-widget .itemlist li { width: 100%; margin-left: 0; margin-right: 0; } }

.some-nakyvyys { font-size: 0; max-width: 340px; }

.some-nakyvyys a.some-button { min-width: 0; width: 32%; margin-right: 2%; margin-left: 0; padding: 1.15em 0.215em; color: #fff; box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.some-nakyvyys a.some-button:last-child { margin-right: 0; }

.some-nakyvyys a.some-button .fa:before { margin-right: 8px; }

.some-button { font-family: 'proxima-nova'; font-size: 14px; line-height: 1; display: inline-block; overflow: hidden; padding: 13px 5px; min-width: 90px; color: #fff; width: 100%; text-transform: none; text-align: center; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.some-button:visited { color: #fff; }

.some-button:hover, .some-button:active, .some-button:visited:hover { color: #fff; }

.some-button .fa:before { font-size: 1.5em; margin: -0.191em 0.096em -0.215em 0.096em; }

.some-button.fb-link { background: #3c5898; }

.some-button.fb-link:hover { background: #2e4373; }

.some-button.twitter-link { background: #6aadd1; }

.some-button.twitter-link:hover { background: #4398c5; }

.some-button.pinterest-link { background: #de010d; }

.some-button.pinterest-link:hover { background: #ab010a; }

.some-button.instagram-link { background: #396896; }

.some-button.instagram-link:hover { background: #2b4e71; }

/* some-napit */
.some img { height: 22px; padding-left: 3px; cursor: pointer; }

.some { display: table-cell; vertical-align: middle; text-align: right; }

.some a.fa { display: inline-block; font-size: 20px; line-height: 22px; padding: 0 5px; color: #aaa; }

.some div { width: 25px; height: 25px; background-size: 100%; background-repeat: no-repeat; background-position: center; border-radius: 50%; display: inline-block; }

.some a:not(:last-child) div { margin-right: 4px; }

.linkkilista .menu li { text-align: center; list-style-type: none; position: relative; margin: 0 auto 20px; /*&:after { width: 0; content: ''; height: 0; border-top: 23px solid #fff; border-bottom: 23px solid #fff; border-left: 24px solid transparent; position: absolute; right: 0; top: 0; }*/ }

.linkkilista .menu li a { font-family: 'proxima-nova'; font-size: 13px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: #fff; padding: 10px 13px; display: block; background: #B52828; box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.linkkilista .menu li a:hover { background: #611616; }

.widget-blogit-uusimmat { text-align: center; }

.widget-blogit-uusimmat ul.list li { padding: 0; list-style-type: none; }

.widget-blogit-uusimmat ul.list > li { margin-bottom: 25px; }

.widget-blogit-uusimmat ul.list > li h3 { margin: 7px 0 2px; font-style: italic; }

.widget-blogit-uusimmat .author-img { display: block; box-sizing: border-box; vertical-align: middle; }

.widget-blogit-uusimmat .author-img img { max-width: 150px; width: 40%; height: auto; border-radius: 50%; }

.widget-blogit-uusimmat .author-posts { display: block; box-sizing: border-box; font-size: 1rem; font-family: "abril-display", georgia, serif; line-height: 1.2; }

.widget-blogit-uusimmat .author-posts li { padding: 0; list-style-type: none; }

.widget-blogit-uusimmat a { color: #444; font-size: 18px; font-weight: 800; }

.carousel-item-small { padding: 15px 8px; box-sizing: border-box; position: relative; }

.carousel-item-small:hover .carousel-item-small__day { background: #000; color: #fff; }

.carousel-item-small a, .carousel-item-small a:visited { color: #444; }

.carousel-item-small__bg { height: 0; padding-top: 93%; background-size: cover; background-position: center center; }

.carousel-item-small__day { position: absolute; top: 20px; right: 14px; display: block; height: 45px; width: 45px; background: #fff; text-align: center; color: #000; line-height: 45px; border-radius: 500px; font-size: 14px; font-family: "abril-display", georgia, serif; font-style: italic; font-weight: 600; letter-spacing: 0.03em; box-shadow: 1px 0 6px rgba(0, 0, 0, 0.23); transition: all 0.2s ease; }

.carousel-item-small .body { text-align: center; margin-top: 15px; }

.slick-prev, .slick-next { background: #B52828; margin: 0; height: 35px; width: 35px; top: 43%; }

.slick-prev:before, .slick-next:before { opacity: 1; font-size: 15px; }

/* collapsing archives */
.collapsing.archives a { color: #222222; }

.collapsing.archives.list { padding: 0; margin-bottom: 30px; }

.collapsing.archives.list, .collapsing.archives.list li { height: auto; border-bottom: 0; line-height: 1.2; }

#sivupalkki .collapsing.archives.list li { padding: 15px 0 0; margin-bottom: 0; }

.collapsing.archives.list .sym { margin-right: 5px; }

li.collapsing.archives ul { padding-left: 19px; list-style-type: none; }

span.collapsing.archives { border-bottom: 1px solid #222222; display: block; height: auto; padding-bottom: 15px; }

.collapsing.archives.list li div > ul { padding-bottom: 10px; }

/* collapsing archives end */
#footer { font-family: 'proxima-nova'; clear: both; padding: 30px 2% 25px 2%; background-color: #000000; margin: 0; color: #fff; overflow: hidden; position: relative; font-size: 13px; line-height: 20px; }

#footer address { line-height: 20px; }

#footer .col-1of3 { float: left; width: 33.33%; box-sizing: border-box; -o-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }

#footer .col-1of3 > ul { margin-bottom: 21px; }

#footer .label { width: 103px; display: inline-block; vertical-align: top; }

#footer .mail-address { display: inline-block; }

#footer .footer-button { display: block; color: #fff; background: #7698AD; padding: 8px; width: 126px; text-align: center; text-transform: uppercase; font-size: 14px; border-radius: 6px; margin-top: 18px; margin-bottom: 5px; transition: all 0.3s ease; }

#footer .footer-button:hover { text-decoration: none; background: #5a7f96; }

#footer .oba-icon { width: 30px; display: inline-block; margin-right: 10px; }

#footer .oba-link { margin-bottom: 21px; display: block; }

#footer .oba-link span { line-height: 32px; height: 32px; display: inline-block; vertical-align: top; }

/*DL, DT, DD TAGS LIST DATA*/
#footer dl { clear: both; }

#footer dl dt { font-weight: bold; font-size: 11px; float: left; margin-right: 10px; }

#footer dl dd { float: left; margin-left: 1px; }

#footer a { text-decoration: none; color: #7698AD; }

#footer a:hover { text-decoration: underline; }

#footer h6 { text-transform: uppercase; font-weight: 600; font-size: 13px; letter-spacing: 0.05em; }

#verkkopalvelut { font-family: 'proxima-nova'; box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 0 2%; width: 100%; background: #fff; }

.verkkopalvelut-inner { width: 100%; max-width: 960px; margin: 0 auto; padding: 20px 0; overflow: hidden; }

#verkkopalvelut dl { color: #7698AD; width: 79%; margin-right: 1%; float: right; }

#verkkopalvelut dl dt { font-weight: bold; float: left; }

#verkkopalvelut dl dd { float: left; margin-right: 3px; font-size: 12px; line-height: 120%; }

#verkkopalvelut dl dd:not(:last-child):after { content: '|'; margin: 0 3px; }

#verkkopalvelut a { color: #7698AD; font-size: 12px; }

#verkkopalvelut .selected { color: #000; font-style: normal; }

.om-logo { width: 20%; float: left; padding-right: 20px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.om-logo img { max-width: 100%; height: auto; }

@media all and (max-width: 970px) { #footer .label { width: auto; display: block; }
  #footer .label:after { content: ':'; } }

@media all and (max-width: 660px) { #footer .col-1of3 { width: 50%; }
  #footer .col-1of3.t-right { float: right; } }

@media all and (max-width: 525px) { /*and (min-width: 320px)*/
  .om-logo, #verkkopalvelut dl { float: none; margin: 0 auto; width: 100%; }
  .om-logo { margin-bottom: 20px; text-align: center; } }

@media screen and (max-width: 440px) { #footer .col-1of3 { width: 100%; }
  #footer .label { width: 103px; display: inline-block; } }

#customer-service-info { color: #999999; font-size: 12px; width: 300px; float: left; line-height: 120%; }

#customer-service-info h4 { font-size: 14px; color: #999999; font-size: 12px; }

.footer-child { width: 960px; max-width: 100%; margin: 0 auto; }

.footer-child h6 { font-size: 15px; }

@media screen and (max-width: 768px) { .carousel-item--body { width: 100%; right: 0; }
  .carousel-item h2 { font-size: 1.8em; }
  .navtabs li { width: 50%; } }

@media screen and (max-width: 768px) { #sivupalkki, .col-two { float: none; margin-left: auto; margin-right: auto; }
  #sivupalkki { max-width: 380px; } }

@media screen and (max-width: 640px) { .article__somebar ul span { display: initial; }
  .navtabs { text-align: center; }
  .navtabs li { width: auto; } }

@media screen and (max-width: 480px) { /* author page */
  .list li img.side-image { float: right; width: auto; }
  .author-posts-list .list li h3 { padding-bottom: 15px; }
  /* /author page */ }

/*# sourceMappingURL=style.css.map */
