/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ [Table of Contents] + Sticky Footer + Animation + General Layout + Wrapper + Header + Main Navigation + Search Form + Basil Slider + Page Banner & Thumbnail + Breadcrumbs + Main Content Styling + Layout Sizes + Page/Post Titles + Widgets + Comments + Form Styling +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ /* +++++++++++++++++++++++++++ Sticky Footer +++++++++++++++++++++++++++ */ html { height: 100%; } body #basil-wrapper { display:block; } /* +++++++++++++++++++++++++++ Animation +++++++++++++++++++++++++++ */ #basil-nav > div > ul, #basil-nav > div > ul li:hover ul, #basil-nav > div > ul > li > ul li.menu-item-has-children > a:after, #basil-slider .basil-slider-arrows .fas, .basil-blog-posts-widget .basil-blog-posts-overlay, .basil-blog-posts-widget .basil-blog-posts-overlay::after { -webkit-transition: all 200ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -moz-transition: all 200ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -o-transition: all 200ms cubic-bezier(0.420, 0.000, 0.050, 1.000); transition: all 200ms cubic-bezier(0.420, 0.000, 0.050, 1.000); } #basil-nav a, #basil-nav.basil-search-active .search-form { -webkit-transition: all 100ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -moz-transition: all 100ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -o-transition: all 100ms cubic-bezier(0.420, 0.000, 0.050, 1.000); transition: all 100ms cubic-bezier(0.420, 0.000, 0.050, 1.000); } #basil-slider .basil-slider-slides .slick-slide { -webkit-transition: opacity 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), transform 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), box-shadow 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -moz-transition: opacity 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), transform 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), box-shadow 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000); -o-transition: opacity 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), transform 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), box-shadow 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000); transition: opacity 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), transform 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000), box-shadow 500ms cubic-bezier(0.420, 0.000, 0.050, 1.000); } .sticky {} .gallery-caption {} .bypostauthor {} /* +++++++++++++++++++++++++++ General Layout +++++++++++++++++++++++++++ */ html { font-size:15px; line-height:1.5em; } .basil-shell { position:relative; max-width:1100px; width:92%; margin:0 auto; } .basil-left { float:left; } .basil-right { float:right; } section.basil-main-template.basil-has-sidebar { float:left; width:65%; } aside.basil-sidebar { float:right; width:30%; } /* +++++++++++++++++++++++++++ Wrapper (Full & Boxed) +++++++++++++++++++++++++++ */ #basil-wrapper { position:relative; } body #basil-wrapper { width:100%; } body.basil-boxed #basil-wrapper { max-width:1400px; margin:0 auto; } /* +++++++++++++++++++++++++++ Header +++++++++++++++++++++++++++ */ #basil-header-wrapper { width:100%; position:relative; } body.home #basil-header-wrapper { height:auto; } #basil-header { width:inherit; background-size:cover; background-position:center center; } body.basil-header-transparent #basil-header { box-shadow:none; } #basil-logo { position:absolute; left:0; top:30%; } #basil-logo img { display:block; margin:0; padding:0; width:auto; max-height:100%; height:100%; } h1#basil-logo { font-size:40px; line-height:1; height:40px; margin-top:-22px; font-weight:600; } #basil-header-wrapper .basil-header-right { float:right; } #basil-header-wrapper .basil-header-right .basil-header-right-content { display:flex; position:absolute; right:0; height:2.4rem; top:50%; margin:-1.2rem 0 0 0; } #basil-header-wrapper .basil-header-right-content > div { margin:0 0 0 0.5rem; } #basil-header-wrapper .basil-header-right-content input { height:2.4rem; } #basil-header-wrapper .basil-header-right-content .basil-search-cooked { margin:0 -0.25rem 0 0; } #basil-header-wrapper .basil-header-right-content .cooked-recipe-search { top:-1px; } #basil-header-wrapper .basil-header-right-content .cooked-browse-search { border-radius:3px 0 0 3px; padding-left:12px; font-size:0.95rem; font-weight:500; } #basil-header-wrapper .basil-header-right-content .cooked-browse-search-button { height:2.4rem; line-height:2.4rem; right:0.2rem; border-radius:0 3px 3px 0; } /* Has Custom Header BG */ #basil-header.basil-header-has-background { background:transparent; position:absolute; top:0; left:0; box-shadow:none; } #basil-header.basil-header-has-background.basil-has-top-bar { top:40px; } #basil-header.basil-header-has-background #basil-nav > div > ul ul { background-color:transparent; } /* +++++++++++++++++++++++++++ Main Navigation +++++++++++++++++++++++++++ */ #basil-nav-wrapper { height:3.25rem; } /* Height */ #basil-nav, #basil-nav > div > ul, #basil-nav > div > ul > li, #basil-nav > div > ul > li > a { line-height:3.2rem; height:3.25rem; } #basil-nav > div > ul > li > a { padding:0 1.1rem; } /* General */ #basil-nav { float:left; width:auto; } #basil-nav > div.basil-main-menu { width:auto; height:auto; } #basil-nav > div > ul { width:auto; list-style:none; padding:0; margin:0; font-size:1rem; letter-spacing:0.01rem; } #basil-nav > div > ul > li { position:relative; display:inline-block; float:left; margin:0; padding:0; font-weight:500; } #basil-nav > div > ul > li:last-child { margin-right:0; } #basil-nav > div > ul > li > a { display:block; } /* Dropdown Arrows */ #basil-nav > div > ul > li.menu-item-has-children > a { position:relative; padding-right:2.5rem; } #basil-nav > div > ul > li.menu-item-has-children > a:after { opacity:0.6; position:absolute; top:50%; margin:-0.4rem 0 0 0; line-height:1; right:1rem; font-size:0.75rem; content:"\f107"; font-family:'Font Awesome 5 Free'; font-weight:600; } /* Dropdowns */ #basil-nav > div > ul > li ul { font-size:0.9rem; z-index:9999; min-width:100%; -moz-border-radius:0 0 10px 10px; -webkit-border-radius:0 0 10px 10px; border-radius:0 0 10px 10px; visibility:hidden; opacity:0; position:absolute; -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); box-shadow:0 2px 3px rgba(0,0,0,0.10); top:3.25rem; left:0; width:auto; padding:0.6rem 1.25rem 0.9rem; margin:0; } #basil-nav > div > ul ul li { line-height:1; white-space:nowrap; display:block; position:relative; text-align:left; padding:0.5rem 0; } #basil-nav > div > ul li:hover > ul { visibility:visible; opacity:1; -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); } /* Sub Dropdowns */ #basil-nav > div > ul > li > ul li.menu-item-has-children > a:after { -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0); opacity:0.6; position:absolute; top:0.5rem; margin:1px 0 0 0; line-height:1; right:0; font-size:0.75rem; content:"\f105"; font-family:'Font Awesome 5 Free'; font-weight:600; } #basil-nav > div > ul > li > ul li.menu-item-has-children:hover > a:after { -webkit-transform:translate3d(-1rem,0,0); transform:translate3d(-1rem,0,0); } #basil-nav > div > ul > li > ul li ul { position:absolute; top:0; left:100%; margin:-0.75rem 0 0 -0.5rem; padding:0.75rem 1.25rem; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; visibility:hidden; opacity:0; position:absolute; -webkit-transform:translate3d(-5px,0,0); transform:translate3d(-5px,0,0); } #basil-nav > div > ul > li > ul a { display:inline-block; opacity:0.75; } #basil-nav > div > ul > li > ul a:hover { opacity:1; } /* Social Icons */ #basil-nav-wrapper .bx-social-icon { float:left; opacity:0.65; font-size:1.5rem; line-height:3.3rem; display:inline-block; } #basil-nav-wrapper .bx-social-icon:hover { opacity:1; } #basil-nav-wrapper .basil-right .bx-social-icon { margin:0 0 0 12px; opacity:0.5; } #basil-nav-wrapper .basil-right .bx-social-icon:hover { opacity:1; } /* +++++++++++++++++++++++++++ Mobile Navigation +++++++++++++++++++++++++++ */ .bx-nav-toggle, .basil-mobile-nav { display:none; } .nav-toggle { position:absolute; top:50%; right:5%; color:inherit; font-size:1.75rem; margin:-0.875rem 0 0 0; } .nav-toggle:hover { color:inherit; } .js .bx-nav-collapse { margin:0; z-index:9999; box-shadow:0 40px 50px rgba(0,0,0,0.15); display:none; } .basil-mobile-nav { padding:20px 0; } .basil-mobile-nav > li > a { font-weight:500; } .basil-mobile-nav > li a { border-top:1px solid rgba(0,0,0,0.075); text-align:center; display:block; font-size:1.1rem; padding:10px 5%; } .basil-mobile-nav > li:first-child a { border-top:none; } .basil-mobile-nav ul.sub-menu > li a { font-size:1rem; padding:8px 5%; } .basil-mobile-nav ul.sub-menu > li ul.sub-menu > li a { padding:5px 5%; font-size:0.9rem; } /* +++++++++++++++++++++++++++ Blog Cards +++++++++++++++++++++++++++ */ .basil-blog-card { text-align:left; background:#fff; text-decoration:none !important; border:none !important; color:inherit !important; display:block; overflow:hidden; border-radius:3px; margin:0 auto 1rem; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.15); } .basil-blog-card > span, .basil-blog-content > span { display:block !important; } .basil-blog-card:hover { text-decoration:none !important; border:none !important; color:inherit !important; } .basil-blog-card-image { margin:0; padding:0; } .basil-blog-card-image img { display:block; margin:0; padding:0; width:100% } .basil-blog-card .basil-blog-sep { display:none; } .basil-blog-card-content { padding:1rem 1.5rem; margin:0; } .basil-blog-card-title { display:block; font-weight:600; margin:0.5rem 0; font-size:1.25rem; line-height:1.65rem; } .basil-blog-card-author { margin:0.5rem 0; font-size:0.9rem; } .basil-blog-card-excerpt { display:block; margin:0.5rem 0; font-size:1rem; } .basil-blog-card-centered, .basil-blog-card-modern-centered { text-align:center; } .basil-blog-card-modern, .basil-blog-card-modern-centered { transform:translate3d(0,0,0); border-radius:10px; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1); } .basil-blog-card-modern .basil-blog-card-title, .basil-blog-card-modern-centered .basil-blog-card-title, .basil-blog-card-modern .basil-blog-card-author, .basil-blog-card-modern-centered .basil-blog-card-author, .basil-blog-card-modern .basil-blog-card-excerpt, .basil-blog-card-modern-centered .basil-blog-card-excerpt { margin:0.25rem 0; } .basil-blog-card-modern .basil-blog-card-content, .basil-blog-card-modern-centered .basil-blog-card-content { padding:1.25rem 1.5rem; } .basil-blog-card-modern .basil-blog-card-author, .basil-blog-card-modern-centered .basil-blog-card-author { opacity:0.75; } .basil-blog-card-modern .basil-blog-card-sep, .basil-blog-card-modern-centered .basil-blog-card-sep { margin:1rem 0; display:block; width:15%; height:6px; border-radius:3px; background:#ddd; } .basil-blog-card-modern-centered .basil-blog-card-sep { margin:1rem auto; } .basil-blog-card-modern:hover, .basil-blog-card-modern-centered:hover { transform:translate3d(0,-2px,0) !important; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1), 0 5px 10px rgba(0,0,0,0.075); } .basil-blog-card-modern:hover .basil-blog-card-sep, .basil-blog-card-modern-centered:hover .basil-blog-card-sep { width:25%; } .widget .basil-blog-card { margin:0 auto; } .basil-blog-card-modern-centered, .basil-blog-card-modern, .basil-blog-card-sep { -webkit-transition: all 200ms cubic-bezier(0.420, 0.000, 0.150, 1.000); -moz-transition: all 200ms cubic-bezier(0.420, 0.000, 0.150, 1.000); -o-transition: all 200ms cubic-bezier(0.420, 0.000, 0.150, 1.000); transition: all 200ms cubic-bezier(0.420, 0.000, 0.150, 1.000); } /* +++++++++++++++++++++++++++ Search Form +++++++++++++++++++++++++++ */ a.basil-cancel-search { display:none; } .search-form { position:relative; } .search-form .search-field { background:transparent; display:inline-block; max-width:100%; width:98%; padding:0 35% 0 10px; border:1px solid rgba(0,0,0,0.1); border-radius:6px 0 0 6px; box-sizing:border-box; -webkit-appearance:none; height:2.4rem; font-size:1rem; line-height:2.4rem; font-weight:400; margin:0; } .search-form .search-submit { display:inline-block; position:absolute; top:0; right:0; margin:0; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } /* +++++++++++++++++++++++++++ Basil Slider +++++++++++++++++++++++++++ */ #basil-slider { overflow:hidden; height:auto; width:100%; position:relative; margin:0; } #basil-slider .basil-slider-title, #basil-slider .basil-slider-subheading { text-align:center; position:relative; z-index:10; max-width:900px; margin:0 auto; } #basil-slider .basil-slider-title a:hover, #basil-slider .basil-slider-subheading a:hover { text-decoration:underline; } #basil-slider .basil-slider-subheading { padding-top:1.5rem; } #basil-slider .basil-slider-bgs { overflow:hidden; position:absolute; top:0; left:0; width:100%; height:100%; } #basil-slider .basil-slider-bgs > div > div > div { height:660px; margin:0; background-position:center center; background-size:cover; } #basil-slider .basil-slider-bgs.basil-featured-image { background-size:cover; background-repeat:none; background-position:center; } #basil-slider .slick-slider { margin:0; overflow:visible; } #basil-slider .basil-slider-slides { max-width:1100px; margin:0 auto; } #basil-slider .basil-slider-slides .slick-list { margin:0 -2rem; padding:0 2rem; } #basil-slider .basil-slider-slides .slick-slide { transform:scale(0.9); opacity:0; width:340px; height:auto; } #basil-slider .basil-slider-slides .slick-slide.slick-active, #basil-slider .basil-slider-slides .slick-slide.slick-current { opacity:1; transform:scale(1); } #basil-slider .basil-slider-slides .slick-slide .single-slide { max-width:340px; height:auto; margin:0 auto; } #basil-slider .basil-slider-arrows { position:absolute; top:0; left:0; width:100%; height:100%; } #basil-slider .basil-slider-arrows .fa-chevron-left { z-index:99; transform:translate3d(0,0,0); position:absolute; font-size:5rem; line-height:5rem; height:5rem; margin-top:-2.5rem; top:50%; left:3rem; color:#fff; cursor:pointer; } #basil-slider .basil-slider-arrows .fa-chevron-right { z-index:99; transform:translate3d(0,0,0); position:absolute; font-size:5rem; line-height:5rem; height:5rem; margin-top:-2.5rem; top:50%; right:3rem; color:#fff; cursor:pointer; } #basil-slider .basil-slider-arrows .fa-chevron-left:hover { transform:translate3d(-3px,0,0); } #basil-slider .basil-slider-arrows .fa-chevron-right:hover { transform:translate3d(3px,0,0); } #basil-slider .basil-slider-arrows .fas.slick-disabled { opacity:0.25; cursor:default; transform:translate3d(0,0,0); } #basil-slider .basil-slider-slides .cooked-recipe-card { margin:0 auto; box-shadow:0 5px 10px rgba(0,0,0,0.25); } #basil-slider .basil-slider-slides .cooked-recipe-card:hover { box-shadow:0 15px 30px rgba(0,0,0,0.5); } #basil-slider .basil-slider-slides .cooked-recipe-card-title { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } #basil-slider .basil-slider-slides .cooked-recipe-card-image img { width:340px; height:226px; } /* +++++++++++++++++++++++++++ Page Banner & Thumbnail +++++++++++++++++++++++++++ */ .basil-page-banner { position:relative; width:100%; height:auto; /*overflow:hidden;*/ background-size:cover; background-position:center; } .basil-page-banner.basil-blank-banner { height:200px; } .basil-page-banner .basil-banner-overlay { width:100%; height:100%; position:absolute; top:0; left:0; } .basil-page-banner .basil-shell { padding:50px 0; } .basil-page-banner .entry-title { font-size:40px; line-height:1.2; padding:5px 0 0 0; margin:0; } .basil-page-banner.basil-title-centered .entry-title, .basil-page-banner.basil-title-centered .bx-breadcrumbs { text-align:center; } .basil-page-banner.basil-title-left .entry-title, .basil-page-banner.basil-title-left .bx-breadcrumbs { text-align:left; } .basil-page-banner.basil-title-right .entry-title, .basil-page-banner.basil-title-right .bx-breadcrumbs { text-align:right; } .basil-page-banner .bx-breadcrumbs { margin:0; } .basil-page-banner .bx-breadcrumbs span { opacity:0.75; } .basil-page-thumbnail { margin:0 0 20px; } .basil-page-thumbnail img { display:block; margin:0; padding:0; } .basil-page-thumbnail.bordered_1,.basil-page-thumbnail.bordered_2,.basil-page-thumbnail.bordered_3,.basil-page-thumbnail.bordered_4 { border-style:solid; } .basil-page-thumbnail.bordered_1 { border-width:1px; padding:5px; } .basil-page-thumbnail.bordered_2 { border-width:1px; padding:10px; } .basil-page-thumbnail.bordered_3 { border-width:2px; padding:10px; } .basil-page-thumbnail.bordered_4 { border-width:3px; padding:2px; } .basil-page-thumbnail.bordered_5 { border-width:10px; padding:1px; } .basil-page-thumbnail.shadow_1 { box-shadow:0px 2px 1px rgba(0,0,0,0.20); } .basil-page-thumbnail.shadow_2 { box-shadow:0px 4px 10px rgba(0,0,0,0.30); } .basil-page-thumbnail.shadow_3 { box-shadow:0px 10px 40px rgba(0,0,0,0.40); } .basil-page-thumbnail.floating { box-shadow:0px 23px 60px rgba(0,0,0,0.20); border-width:20px; border-style:solid; border-color:#fff; } /* +++++++++++++++++++++++++++ Main Content Styling +++++++++++++++++++++++++++ */ #basil-main { padding:3rem 0 0.5rem; } #basil-main article.hentry { position:relative; padding:0 0 0.5rem; margin:0 0 2rem; } #basil-main article.hentry.basil-blog-list-item:before { content:""; display:block; background:rgba(0,0,0,0.15); width:7%; height:6px; border-radius:3px; position:relative; top:-1.5rem; left:0; transition:width .2s, background .2s; } #basil-main article.hentry.basil-blog-list-item:hover:before { width:10%; } #basil-main article.hentry.basil-blog-list-item .entry-footer { margin:0; } #basil-main article.hentry.basil-blog-list-item { padding-top:1.5rem; } #basil-main article.hentry.basil-blog-list-item:first-child { padding-top:3.5rem; } #basil-main .basil-has-page-banner article.hentry.basil-blog-list-item:first-child { padding-top:1.5rem; } #basil-main article.hentry.basil-content { padding-bottom:0; } #basil-main .more-link { margin:0.25rem 0 0 0; padding:0 0.75rem; height:2rem; line-height:1.85rem; } #basil-main a:hover { text-decoration:underline; } #basil-main .post-thumbnail { display:block; width:100%; margin:0 0 1rem 0; } #basil-main .post-thumbnail img { width:100%; height:auto; } #basil-main img, #basil-main figure { max-width:100%; display:block; margin:0; padding:0; } #basil-main .wp-block-image .aligncenter>figcaption, #basil-main .wp-block-image .alignleft>figcaption, #basil-main .wp-block-image .alignright>figcaption, #basil-main .wp-block-image.is-resized>figcaption { display:block; } #basil-main .alignleft { float:left; margin:0 25px 30px 0; } #basil-main .alignright { float:right; margin:0 0 30px 25px; } #basil-main .aligncenter { float:none; margin:0 auto 30px; } #basil-main .alignnone { float:none; margin:0 0 30px; } #basil-main .alignleft img { float:left; margin:0; } #basil-main .alignright img { float:right; margin:0; } #basil-main .aligncenter img { float:none; margin:0 auto 0; } #basil-main .alignnone img { float:none; margin:0; } #basil-main .wp-caption-text { font-size:0.75rem; padding:5px 0; } #basil-main ul, #basil-main ol, #basil-main p, #basil-main h1, #basil-main h2, #basil-main h3, #basil-main h4, #basil-main h5, #basil-main h6, #basil-main table, #basil-main address, #basil-main dl, #basil-main pre { margin:0 0 1rem; padding:0; line-height:1.5em; } #basil-main .basil-main-template ul, #basil-main .basil-main-template ol { margin:0 0 20px 40px; } #basil-main .basil-main-template ul ul, #basil-main .basil-main-template ol ol, #basil-main .basil-main-template ol ul, #basil-main .basil-main-template ul ol { margin:7px 0 0 20px; } #basil-main .basil-main-template ul li, #basil-main .basil-main-template ol li { padding:0 0 5px; margin:0; } #basil-main .basil-main-template table td, #basil-main table th { padding:7px 10px; } #basil-main .basil-main-template table th { font-weight:600; } #basil-main .basil-main-template table tr.odd { background:rgba(0,0,0,0.05); } #basil-main .basil-main-template pre { border:1px solid rgba(0,0,0,0.15); padding:10px; display:block; background:rgba(0,0,0,0.05); font-family:monospace; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; max-width:100%; white-space:pre; overflow-x:auto; } #basil-main .basil-main-template code, #basil-main .basil-main-template kbd, #basil-main .basil-main-template tt { background:rgba(0,0,0,0.05); font-family:monospace; display:inline-block; margin:0 2px; padding:0 5px; } #basil-main .basil-main-template q:before { content:"\201C"; } #basil-main .basil-main-template q:after { content:"\201D"; } #basil-main .basil-main-template var { font-weight:bold; font-style:italic; opacity:0.65; } #basil-main .basil-main-templatedt { font-weight:600; } #basil-main .basil-main-template dd { margin:0 0 10px; } #basil-main .basil-main-template big { font-size:125%; } #basil-main .basil-main-template abbr { opacity:0.65; } #basil-main .basil-main-template acronym, #basil-main .basil-main-template cite { font-style:italic; opacity:0.65; } #basil-main .basil-main-template h4 { font-weight:600; } /* +++++++++++++++++++++++++++ Audio Player +++++++++++++++++++++++++++ */ #basil-main .fluid-width-video-wrapper { margin:0 0 1.5rem; } #basil-main .wp-playlist-tracks .wp-playlist-caption { padding:4px 0; } #basil-main .wp-playlist-tracks .wp-playlist-item-length { top:4px; } #basil-main .wp-playlist-light { border:1px solid rgba(0,0,0,0.15); padding:20px 20px 15px; border-radius:6px; } #basil-main .wp-playlist-current-item .wp-playlist-item-title { font-weight:600; } #basil-main .wp-playlist-item { border-color:rgba(0,0,0,0.1); } /* +++++++++++++++++++++++++++ Breadcrumbs +++++++++++++++++++++++++++ */ #basil-main .basil-main-template .bx-breadcrumbs, .bx-breadcrumbs { list-style:none; margin:0; overflow:hidden; } #basil-main .basil-main-template .bx-breadcrumbs li, .bx-breadcrumbs li { text-transform:uppercase; padding:0; margin:0; font-size:12px; letter-spacing:1px; font-weight:300; display:inline-block; vertical-align:middle; margin-right:5px; } #basil-main .basil-main-template .bx-breadcrumbs li a, .bx-breadcrumbs li a { font-weight:600; } #basil-main .basil-main-template .bx-breadcrumbs .bx-separator i.fas, .bx-breadcrumbs .bx-separator i.fas { font-size:12px; position:relative; top:-1px; opacity:0.5; } /* +++++++++++++++++++++++++++ Layout Sizes +++++++++++++++++++++++++++ */ #basil-main.bx-width-full, #basil-main.bx-width-full .basil-shell, #basil-main.bx-width-full .basil-main-template { max-width:100%; width:100%; padding:0; } #basil-main.bx-width-default .basil-main-template { max-width:1100px; } #basil-main.bx-width-1000px .basil-main-template { max-width:1000px; } #basil-main.bx-width-900px .basil-main-template { max-width:900px; } #basil-main.bx-width-800px .basil-main-template { max-width:800px; } #basil-main.bx-width-700px .basil-main-template { max-width:700px; } #basil-main.bx-width-600px .basil-main-template { max-width:600px; } #basil-main .basil-main-template { margin:0 auto; } /* +++++++++++++++++++++++++++ Page/Post Titles +++++++++++++++++++++++++++ */ #basil-main h1.entry-title { font-weight:600; } #basil-main h2.entry-title, #basil-main h3.entry-title { font-weight:700; } #basil-main h1.entry-title a, #basil-main h2.entry-title a, #basil-main h3.entry-title a { color:inherit; } #basil-main h1.entry-title a:hover, #basil-main h2.entry-title a:hover, #basil-main h3.entry-title a:hover { text-decoration:none; } .entry-footer { margin:3rem 0; } .entry-footer .basil-post-meta { opacity:1; font-weight:400; text-transform:uppercase; display:block; font-size:0.8rem; line-height:1.4rem; margin:0; } .entry-footer .basil-post-meta a { color:inherit; font-weight:800; } .entry-footer .basil-post-meta .tags-links, .entry-footer .basil-post-meta .cat-links { position:relative; padding-left:25px; display:block; text-transform:none; } .entry-footer .basil-post-meta .tags-links a, .entry-footer .basil-post-meta .cat-links a { font-weight:600; } .entry-footer .basil-post-meta .cat-links::before { opacity:0.5; content:'\f07b'; font-family:'Font Awesome 5 Free'; font-weight:600; font-size:14px; position:absolute; left:0; top:0; } .entry-footer .basil-post-meta .tags-links::before { opacity:0.5; content:'\f292'; font-family:'Font Awesome 5 Free'; font-weight:600; font-size:14px; position:absolute; left:0; top:0; } .entry-header .basil-post-meta { opacity:0.5; font-weight:400; text-transform:uppercase; display:block; font-size:0.8rem; line-height:1rem; margin:0; letter-spacing:0.03rem; } .entry-header .basil-post-meta a { color:inherit; font-weight:700; } #basil-main .post-navigation { margin:3rem 0; padding-top:0.75rem; border-top:2px solid rgba(0,0,0,0.1); } #basil-main .post-navigation { opacity:1; font-weight:400; display:block; margin:0; } #basil-main .post-navigation a { line-height:1.3rem; box-sizing:border-box; width:50%; position:relative; display:block; color:inherit; font-weight:800; } #basil-main .post-navigation a:hover { text-decoration:none; } #basil-main .post-navigation a > .nav-subtitle { opacity:0.35; text-transform:uppercase; font-size:0.8rem; display:block; } #basil-main .post-navigation a > .nav-title { opacity:0.75; font-size:0.9rem; display:block; } #basil-main .post-navigation a > i { opacity:0.75; position:absolute; top:0.4rem; font-size:1.8rem; } #basil-main .post-navigation a:hover > .nav-subtitle { opacity:0.5; } #basil-main .post-navigation a:hover > .nav-title, #basil-main .post-navigation a:hover > i { opacity:1; } #basil-main .post-navigation a[rel="prev"] { float:left; padding-left:2.5rem; } #basil-main .post-navigation a[rel="prev"] > i { left:0; } #basil-main .post-navigation a[rel="next"] { float:right; padding-right:2.5rem; text-align:right; } #basil-main .post-navigation a[rel="next"] > i { right:0; } /* +++++++++++++++++++++++++++ Widgets +++++++++++++++++++++++++++ */ h2.widget-title { font-size:1.2rem; font-weight:600; letter-spacing:0.03rem; margin:0 0 1rem; } .widget { display:block; padding:0 0 3rem; } .widget ul { margin:0 !important; padding:0; list-style:none; } .widget > ul > li, .widget div > ul > li { display:block; padding:8px 0; border-top:1px solid #ddd; border-top:1px solid rgba(0,0,0,0.15); } .widget ul li { font-size:1rem; } .widget ul li > span.post-date { display:block; font-size:0.9rem; } .widget > ul > li:last-child, .widget div > ul > li:last-child { padding-bottom:0 } /* +++++++++++++++++++++++++++ Homepage Widgets +++++++++++++++++++++++++++ */ #basil-homepage-widgets .widget { padding:0; } #basil-homepage-widgets .carbon_fields_basil_homepage_parallax { border:none; background-color:transparent !important; padding:0 !important; margin:0; } .basil-parallax-widget { width:100%; position:relative; background:transparent; } .basil-parallax-widget .basil-parallax-overlay { width:100%; height:100%; position:absolute; top:0; left:0; } .basil-parallax-widget .basil-shell { padding:0; } .basil-parallax-widget .basil-parallax-title { text-align:center; line-height:1.4; padding:0; margin:1rem 0; } .basil-parallax-widget .basil-parallax-content { text-align:center; line-height:1.6; margin:1rem 0; } .basil-parallax-widget .basil-parallax-content a:hover { text-decoration:underline; } #basil-homepage-widgets .carbon_fields_basil_homepage_content_columns { padding:0 !important; border:none; } .basil-column-content-widget { width:100%; margin:0; padding:3rem 0; } .basil-column-content-widget .basil-shell { display:flex; justify-content:center; max-width:calc(1100px + 3% ); } .basil-column-content-widget .basil-column-content-column { width:100%; padding:0 2%; box-sizing:border-box; } .basil-column-content-widget .basil-column-content-image img { display:block; margin:0 0 1.25rem; border-radius:3px; padding:0; min-width:100%; height:auto; } .basil-column-content-widget .basil-column-content-title { margin:0 0 1.25rem; } .basil-column-content-widget .basil-column-content-content p { margin:0 0 1rem; } #basil-homepage-widgets .carbon_fields_basil_homepage_blog_posts { padding:0 !important; border:none; } .basil-blog-posts-widget { width:100%; margin:0; padding:0; } .basil-blog-posts-widget .basil-shell { display:flex; flex-wrap:wrap; justify-content:center; max-width:calc(1100px + 1.5% ); padding:3rem 0 0; } .basil-blog-posts-widget .basil-blog-posts-single { display:block; padding:0 1% 2%; width:31.333%; } .basil-blog-posts-widget .basil-blog-card { display:block; width:97%; } .basil-blog-posts-widget .basil-blog-posts-overlay { background:#ddd; height:200px; width:100%; position:relative; } .basil-blog-posts-widget .has-image .basil-blog-posts-overlay { background:transparent; } .basil-blog-posts-widget .basil-blog-posts-title { text-align:center; line-height:1.4; padding:0; margin:1rem 0; } .basil-blog-posts-widget .basil-blog-posts-content { text-align:center; line-height:1.6; margin:1rem 0; } .basil-blog-posts-widget .basil-blog-posts-content a:hover { text-decoration:underline; } .basil-blog-posts-widget .has-image .basil-blog-posts-overlay::after { opacity:0; } .basil-blog-posts-widget .basil-blog-posts-overlay::after { transform:scale(1); content:"\f570"; font-family:"Font Awesome 5 Free"; font-weight:600; font-size:5rem; line-height:1; text-align:center; width:5rem; height:5rem; color:#fff; position:absolute; top:50%; left:50%; margin:-2.5rem 0 0 -2.5rem; } .basil-blog-posts-widget .has-image .basil-blog-posts-overlay::after { transform:translate3d(1); } .basil-blog-posts-widget .basil-blog-posts-overlay.audio::after { content:"\f025"; } .basil-blog-posts-widget .basil-blog-posts-overlay.video::after { content:"\f03d"; } .basil-blog-posts-widget .basil-blog-posts-overlay.image::after { content:"\f03e"; } .basil-blog-posts-widget .basil-blog-posts-overlay.gallery::after { content:"\f302"; } .basil-blog-posts-widget .basil-blog-card:hover .basil-blog-posts-overlay::after { opacity:1; transform:scale(1.1) } .basil-blog-posts-widget .basil-blog-card:hover .has-image .basil-blog-posts-overlay { opacity:0.9; } #basil-homepage-widgets .carbon_fields_basil_homepage_recipes { padding:0 !important; border:none; } .basil-recipes-widget { width:100%; margin:0; padding:3rem 0; } .basil-recipes-widget .basil-shell { max-width:calc(1100px + 3% ); } .basil-recipes-widget .basil-recipes-title { text-align:center; line-height:1.4; padding:0; margin:1rem 0; } .basil-recipes-widget .basil-recipes-content { text-align:center; line-height:1.6; margin:1rem 0; } .basil-recipes-widget .basil-recipes-content a:hover { text-decoration:underline; } .basil-recipes-widget .cooked-recipe-grid { margin-bottom:0; } #calendar_wrap table { width:100%; } /* +++++++++++++++++++++++++++ WordPress Galleries +++++++++++++++++++++++++++ */ #basil-main .gallery { display:flex; flex-wrap:wrap; margin:0 -1% 1rem; } #basil-main .gallery .gallery-item img { width:100%; height:auto; border-radius:3px; } #basil-main .gallery-columns-1 .gallery-item { width:100%; padding:0 0 2%; } #basil-main .gallery-columns-2 .gallery-item { width:48%; padding:0 1% 2%; } #basil-main .gallery-columns-3 .gallery-item { width:31.333%; padding:0 1% 2%; } #basil-main .gallery-columns-4 .gallery-item { width:23%; padding:0 1% 2%; } #basil-main .gallery-columns-5 .gallery-item { width:18%; padding:0 1% 2%; } #basil-main .gallery-columns-6 .gallery-item { width:14.666%; padding:0 1% 2%; } #basil-main .gallery-columns-7 .gallery-item { width:12.285%; padding:0 1% 2%; } #basil-main .gallery-columns-8 .gallery-item { width:10.5%; padding:0 1% 2%; } #basil-main .gallery-columns-9 .gallery-item { width:9.111%; padding:0 1% 2%; } /* +++++++++++++++++++++++++++ Gutenberg Galleries +++++++++++++++++++++++++++ */ #basil-main .wp-block-gallery { display:flex; flex-wrap:wrap; margin:0 -1% 1rem !important; } #basil-main .wp-block-gallery .blocks-gallery-item img { width:100%; height:auto; border-radius:3px; } #basil-main .wp-block-gallery.columns-1 .blocks-gallery-item { width:100%; padding:0 0 2%; } #basil-main .wp-block-gallery.columns-2 .blocks-gallery-item { width:48%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-3 .blocks-gallery-item { width:31.333%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-4 .blocks-gallery-item { width:23%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-5 .blocks-gallery-item { width:18%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-6 .blocks-gallery-item { width:14.666%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-7 .blocks-gallery-item { width:12.285%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-8 .blocks-gallery-item { width:10.5%; padding:0 1% 2%; } #basil-main .wp-block-gallery.columns-9 .blocks-gallery-item { width:9.111%; padding:0 1% 2%; } /* +++++++++++++++++++++++++++ Pagination +++++++++++++++++++++++++++ */ .nav-links { margin:0 0 3rem; display:flex; justify-content:left; } .nav-links > span, .nav-links > a { display: block; line-height: 30px; text-decoration: none; padding: 0; font-size: 12px; text-align: center; border-radius: 20px; height: 30px; width: 30px; margin: 0 5px 0 0; } .nav-links > span { background:rgba(0,0,0,0.1); color:rgba(0,0,0,0.5); } .nav-links > a { font-weight:500; } .nav-links > a:hover { text-decoration:none !important } .nav-links > a.prev { margin:0 10px 0 0; } .nav-links > a.next { margin:0 0 0 10px; } .nav-links > a.next, .nav-links > a.prev { width:auto; background:none !important; color:inherit !important; font-size:1rem; } .nav-links > a.next:hover, .nav-links > a.prev:hover { background:none !important; color:inherit !important; text-decoration:underline !important } /* +++++++++++++++++++++++++++ Comments +++++++++++++++++++++++++++ */ #basil-main h2.basil-comment-reply-title { margin-bottom:0.1rem; } #basil-main h2 small { font-size:70%; font-weight:600; } #basil-main p.logged-in-as { font-size:0.9rem; } .basil-comments-area { border-top:2px solid rgba(0,0,0,0.15); padding-top:1.25rem; } .basil-comments-area form { display:block; } .basil-comments-area form label { display:block; margin:0 0 0.5rem 0; padding:0; } .basil-comments-area form input[type="text"], .basil-comments-area form input[type="email"], .basil-comments-area form input[type="tel"], .basil-comments-area form input[type="url"], .basil-comments-area form textarea { margin:0 0 0.5rem; width:100%; box-sizing:border-box; border:1px solid #ddd; display:block; padding:0.5rem; } .basil-comments-area form textarea { padding:1rem; } #basil-main .basil-main-template .basil-comment-list { list-style:none; margin:0 0 2rem; } #basil-main .basil-main-template .basil-comment-list li { padding:1.5rem 1.5rem 0.5rem 1.5rem; margin:0 0 1rem; background: #fff; border: 1px solid rgba(0,0,0,0.15); border-radius: 3px; box-shadow: 0 2px 1px rgba(0,0,0,0.075); } #basil-main .basil-main-template .basil-comment-list li .comment-body { margin:0 0 1rem; } #basil-main .basil-main-template .basil-comment-list ol.children { list-style:none; margin:0; } #basil-main .basil-main-template .basil-comment-list ol.children li { background:rgba(0,0,0,0.025); } #basil-main .basil-main-template .basil-comment-list .comment-meta { margin:0 0 1rem; padding:0 0 1rem; border-bottom:1px solid rgba(0,0,0,0.15); } #basil-main .basil-main-template .basil-comment-list .comment-author img.avatar { width:2.5rem; height:2.5rem; position:relative; top:0.2rem; border-radius:2rem; display:inline-block; float:left; margin:0 1rem 0 0; } #basil-main .basil-main-template .basil-comment-list .comment-author > b, #basil-main .basil-main-template .basil-comment-list .comment-author > span { display:inline-block; } #basil-main .basil-main-template .basil-comment-list .comment-author > span.says { display:none; } #basil-main .basil-main-template .basil-comment-list .comment-metadata { font-size:0.75rem; color:#aaa; } #basil-main .basil-main-template .basil-comment-list .comment-metadata a { color:#aaa; } #basil-main .basil-main-template .basil-comment-list .reply { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.02rem; font-weight: 600; margin: -1rem 0 0 0; } #basil-main .basil-main-template .basil-comment-list .comment-respond { margin:1rem 0 0 0; } #basil-nav .customize-partial-edit-shortcut { top:50%; left:0; margin:-17px 0 0 0; } #basil-logo .customize-partial-edit-shortcut { top:50%; margin:-17px 0 0 0; left:-5px; } /* +++++++++++++++++++++++++++ Footer +++++++++++++++++++++++++++ */ #basil-footer { z-index:5; min-height:60px; line-height:60px; font-size:0.9rem; position:relative; } #basil-footer .bx-social-icon { float:left; font-size:23px; display:inline-block; } #basil-footer .basil-right .bx-social-icon { margin:0 0 0 12px; } #basil-footer .basil-left .bx-social-icon { margin:0 12px 0 0; } #basil-footer .basil-footer-widgets { display:flex; line-height:1.6; font-size:1rem; padding:2rem 0; margin:0 -2%; border-bottom:1px solid rgba(255,255,255,0.1); } #basil-footer .basil-footer-widgets .basil-footer-widget-block { width:100%; max-width:100%; padding:0 2%; } #basil-footer .basil-footer-widgets .basil-footer-widget-block .widget { padding:0 0 2rem; } #basil-footer .basil-footer-widgets .basil-footer-widget-block .widget:last-child { padding:0; } #basil-footer .basil-footer-widgets h2.widget-title { text-transform:none; letter-spacing:0; font-size:1.2rem; } #basil-footer .basil-footer-widgets .basil-footer-widget-block .widget p { margin-bottom:1rem; } #basil-footer .basil-footer-widgets .basil-footer-widget-block .widget p:last-child { margin:0; } #basil-footer .cooked-shortcode-recipe-list .cooked-srl-single { border-color:rgba(255,255,255,0.15); } #basil-footer .cooked-recipe-search.cooked-search-no-sorting.cooked-search-no-browse .cooked-fields-wrap > .cooked-browse-search { border-radius:3px 0 0 3px; } /* +++++++++++++++++++++++++++ Form Styling +++++++++++++++++++++++++++ */ #basil-main form p { margin-bottom:1rem; } form fieldset { border:none; margin-bottom: 1rem; } form fieldset legend { font-weight:600; font-size:1.2rem; margin-bottom:1rem } form label { display: block; text-transform:uppercase; font-weight:800; font-size: 0.75rem; letter-spacing:0.03em; margin-bottom: 0.25rem; } form p > label { text-transform:none; letter-spacing:0; font-weight:inherit; font-size:1rem; } form input[type="checkbox"], form input[type="radio"] { display:inline-block; margin-right:0.25rem; position:relative; top:-1px; } form input[type="text"], form input[type="tel"], form input[type="email"], form input[type="number"], form input[type="password"], form textarea, form select { display:block; border:1px solid #e5e5e5; box-shadow:0 1px 1px rgba(0,0,0,0.075); border-radius:3px; padding:8px 10px; width:100%; margin:0 0 20px; } form select { background:#fff; height:35px; } form input[type="file"] { margin:0 0 20px; } form textarea { height:10rem; padding:13px 15px; }