/*!
Theme Name: sparringspoons
Theme URI: http://underscores.me/
Author: David Bernstein
Author URI: http://davidbernstein.ca
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: sparringspoons
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

sparringspoons is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&family=Quicksand:wght@400;700&display=swap");
body {
  font-size: 18px;
}

.symbiotiq-card {
  padding: 30px 15px 0 15px;
}
.symbiotiq-card .card-bg {
  background: #495f76;
  height: 300px;
  width: 400px;
  border-radius: 2px;
  box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.53);
  margin-left: -15px;
  margin-top: -15px;
  position: relative;
}
.symbiotiq-card .card-bg .inner-card-bg {
  background: white;
  min-height: 300px;
  width: 400px;
  z-index: 10;
  position: absolute;
  top: -15px;
  right: -15px;
  border-radius: 2px;
  box-shadow: -5px 6px 9px 1px rgba(0, 0, 0, 0.62);
  transition: transform 0.3s ease;
}
.symbiotiq-card .card-bg .inner-card-bg h2 {
  font-weight: bold;
  color: #495f76;
  text-decoration: underline;
}
.symbiotiq-card .card-bg .inner-card-bg ul {
  list-style-position: inside;
  list-style-type: square;
  padding-left: 0;
}
.symbiotiq-card .card-bg .inner-card-bg ul li {
  font-family: "Open Sans", sans-serif;
  font-size: 1.3rem;
}
.symbiotiq-card .card-bg .inner-card-bg:hover {
  transform: translate(-10px, 10px);
}

.btn-opaque, .btn-transparent {
  transition: all ease;
  transition-duration: 0.6s;
  font-weight: bold;
  letter-spacing: 1px;
  padding: 0.5rem 1rem;
  border-radius: 4px;
}

.btn-opaque:hover, .btn-transparent:hover {
  text-decoration: none;
  transform: scale(1.05);
}

.btn-opaque {
  background-color: var(--primary_button_bg);
  color: var(--primary_button_text);
  border: 2px solid var(--primary_button_border);
}

.btn-opaque:hover {
  background: var(--primary_button_bg_hover);
  border: 2px solid var(--primary_button_border_hover);
  color: var(--primary_button_text_hover);
}

.btn-transparent {
  background-color: var(--secondary_button_bg);
  border: 2px solid var(--secondary_button_border);
  color: var(--secondary_button_text);
}

.btn-transparent:hover {
  background-color: var(--secondary_button_bg_hover);
  color: var(--secondary_button_text_hover);
  border: 2px solid var(--secondary_button_border_hover);
  text-decoration: none;
}

section {
  padding: 4rem 0;
}
@media (min-width: 992px) {
  section {
    padding: 5rem 0;
  }
}

h1, h2, h3, h4, h5, h6, a {
  font-family: "Quicksand", sans-serif;
}

label {
  font-family: "Open Sans", sans-serif;
}

p {
  font-family: "Open Sans", sans-serif;
  line-break: normal;
  word-break: break-word;
}

.banner {
  min-height: 50vh;
  position: relative;
}

.banner-text {
  padding-top: 230px;
}
@media (min-width: 992px) {
  .banner-text {
    padding-top: 170px;
  }
}
.banner-text h1 {
  font-weight: bold;
}
.banner-text h2 {
  color: white;
}
.banner-text .cta-buttons a {
  font-size: 1.2rem;
}

/* [1] The container */
.img-hover-zoom {
  overflow: hidden;
  /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
  transition: transform 0.5s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
  transform: scale(1.1);
}

/*PAGINATION

 */
.pagination ul {
  position: relative;
  background: #fff;
  display: flex;
  padding: 10px 20px;
  border-radius: 14px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.69);
}
.pagination ul li {
  list-style: none;
  line-height: 50px;
  margin: 0 5px;
}
.pagination ul li.pageNumber {
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
}
.pagination ul li a, .pagination ul li span {
  display: block;
  text-decoration: none;
  color: #383838;
  font-weight: 600;
  border-radius: 50%;
}
.pagination ul li.pageNumber:hover a,
.pagination ul li.pageNumber.active span {
  background: #383838;
  color: #fff;
}
.pagination ul li:first-child {
  margin-right: 30px;
  font-weight: 700;
  font-size: 20px;
}
.pagination ul li:last-child {
  margin-left: 30px;
  font-weight: 700;
  font-size: 20px;
}

nav {
  background: var(--nav_bg);
  width: 100%;
  position: absolute;
  transition-timing-function: ease;
  transition-duration: 1s;
}
nav .contact-nav a {
  color: var(--nav_email);
}
nav .contact-nav a:hover {
  color: var(--nav_email_hover);
}
nav .menu-nav img {
  max-height: 130px;
  width: auto;
}

nav.shrink-nav .menu-nav img {
  max-height: 50px;
}

@media (min-width: 992px) {
  nav .contact-nav a:first-child {
    font-size: 1.3rem;
  }
  nav img {
    margin-top: -24px;
  }
  nav .menus a.nav-link {
    color: var(--nav_link);
    font-size: 1.5rem;
  }
  nav .menus a.nav-link:hover {
    color: var(--nav_link_hover);
  }
}
@media (max-width: 992px) {
  .contact-nav .btn-transparent {
    padding: 0.2rem 0.5rem;
  }
}
nav.shrink-nav {
  background: var(--nav_scroll_bg);
  position: fixed;
  z-index: 200;
}
nav.shrink-nav .contact-nav {
  transition-duration: 1s;
  display: none !important;
}
nav.shrink-nav .menu-nav img {
  transition-timing-function: ease;
  transition-duration: 0.5s;
  margin-top: 0;
}

nav {
  overflow: hidden;
  transition: all 0.5s ease-out, background 1s ease-out;
  transition-delay: 0.2s;
  z-index: 300;
}
nav .burger-container {
  position: relative;
  display: inline-block;
  height: 50px;
  width: 50px;
  cursor: pointer;
  transform: rotate(0deg);
  transition: all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  z-index: 999;
}
nav .burger-container #burger {
  width: 26px;
  height: 8px;
  position: relative;
  display: block;
  margin: -4px auto 0;
  top: 50%;
}
nav .burger-container #burger .bar {
  width: 100%;
  height: 2px;
  display: block;
  position: relative;
  background: var(--nav_link);
  transition: all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  transition-delay: 0s;
}
nav .burger-container #burger .bar.topBar {
  transform: translateY(0px) rotate(0deg);
}
nav .burger-container #burger .bar.btmBar {
  transform: translateY(6px) rotate(0deg);
}
nav .icon {
  display: inline-block;
  position: absolute;
  height: 100%;
  line-height: 50px;
  width: 50px;
  height: 50px;
  text-align: center;
  color: var(--nav_link);
  font-size: 22px;
  left: 50%;
  transform: translateX(-50%);
}
nav .icon.icon-bag {
  right: 0;
  top: 0;
  left: auto;
  transform: translateX(0px);
  transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  transition-delay: 0.65s;
}
nav ul.menu {
  position: absolute;
  flex-direction: column;
  display: block;
  padding-top: 160px;
  width: calc(100%);
  top: 0;
  padding-right: 45px;
  z-index: -1;
  list-style: none;
}
nav ul.menu li.menu-item {
  border-bottom: 1px solid #333;
  margin-top: 5px;
  transform: scale(1.15) translateY(-30px);
  opacity: 0;
  transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
}
nav ul.menu li.menu-item:nth-child(1) {
  transition-delay: 0.49s;
}
nav ul.menu li.menu-item:nth-child(2) {
  transition-delay: 0.42s;
}
nav ul.menu li.menu-item:nth-child(3) {
  transition-delay: 0.35s;
}
nav ul.menu li.menu-item:nth-child(4) {
  transition-delay: 0.28s;
}
nav ul.menu li.menu-item:nth-child(5) {
  transition-delay: 0.21s;
}
nav ul.menu li.menu-item:nth-child(6) {
  transition-delay: 0.14s;
}
nav ul.menu li.menu-item:nth-child(7) {
  transition-delay: 0.07s;
}
nav ul.menu li.menu-item a {
  display: block;
  position: relative;
  color: var(--nav_link);
  text-decoration: none;
  font-size: 22px;
  line-height: 2.35;
  font-weight: 200;
  width: 100%;
}
nav.menu-opened {
  height: 100%;
  background-color: var(--nav_scroll_bg);
  transition: all 0.3s ease-in, background 0.5s ease-in;
  transition-delay: 0.25s;
}
nav.menu-opened .burger-container {
  transform: rotate(90deg);
}
nav.menu-opened .burger-container #burger .bar {
  transition: all 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99);
  transition-delay: 0.2s;
}
nav.menu-opened .burger-container #burger .bar.topBar {
  transform: translateY(4px) rotate(45deg);
}
nav.menu-opened .burger-container #burger .bar.btmBar {
  transform: translateY(3px) rotate(-45deg);
}
nav.menu-opened ul.menu {
  display: flex;
}
nav.menu-opened ul.menu li.menu-item {
  transform: scale(1) translateY(0px);
  opacity: 1;
}
nav.menu-opened ul.menu li.menu-item:nth-child(1) {
  transition-delay: 0.27s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(2) {
  transition-delay: 0.34s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(3) {
  transition-delay: 0.41s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(4) {
  transition-delay: 0.48s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(5) {
  transition-delay: 0.55s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(6) {
  transition-delay: 0.62s;
}
nav.menu-opened ul.menu li.menu-item:nth-child(7) {
  transition-delay: 0.69s;
}
nav.menu-opened .icon.icon-bag {
  transform: translateX(75px);
  transition-delay: 0.3s;
}

.content {
  padding: 67px 4% 0;
  text-align: justify;
  overflow: scroll;
  max-height: 100%;
}
.content::-webkit-scrollbar {
  display: none;
}
.content h2 {
  margin-bottom: 0;
  letter-spacing: 1px;
}
.content img {
  width: 95%;
  position: relative;
  display: block;
  margin: 75px auto 75px;
}
.content img:nth-of-type(2) {
  margin: 75px auto;
}

@media (max-width: 600px) {
  .header {
    position: fixed;
  }
}
.banner#six_threads_banner {
  height: 100vh;
}

#newest-recipes {
  background-color: #d1deed;
}

.product-box {
  background: white;
  border-radius: 2px;
  box-shadow: -5px 6px 9px 1px rgba(0, 0, 0, 0.62);
  transition: all 0.15s ease;
}
.product-box h3 {
  color: #495f76;
}
.product-box h3 a {
  color: #495f76;
  font-weight: bold;
}
.product-box h3 a:hover {
  color: #495f76;
}
.product-box:hover {
  box-shadow: -3px 2px 7px 0px rgba(0, 0, 0, 0.62);
}

.recipe_squares h2 {
  color: #262626;
  font-weight: bold;
  text-align: center;
  font-size: 3rem;
}
.recipe_squares h2:after {
  content: "";
  display: block;
  width: 100%;
  max-width: 320px;
  height: 4px;
  margin: 0 auto;
  margin-top: 0.8rem;
  background: #495f76;
}
.recipe_squares img {
  width: 100%;
  height: 230px;
  overflow: hidden;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 768px) {
  .cta-buttons .btn-transparent, .cta-buttons .btn-opaque {
    min-width: 80%;
  }
}
@media (max-width: 400px) {
  #custom-clothes-cta .row {
    transform: scale(0.8);
  }
}
#get-a-quote-section {
  background: #262626;
}
#get-a-quote-section .symbiotiq-card .card-bg, #get-a-quote-section .symbiotiq-card .card-bg .inner-card-bg {
  width: 450px;
}

@media (max-width: 400px) {
  #get-a-quote-section {
    overflow: hidden;
  }
  #get-a-quote-section .symbiotiq-card .card-bg, #get-a-quote-section .symbiotiq-card .card-bg .inner-card-bg {
    width: 350px;
  }
  #get-a-quote-section .symbiotiq-form-control-checkbox label, #get-a-quote-section .symbiotiq-form-control label {
    font-size: 1rem;
  }
}
.symbiotiq-form-control {
  display: flex;
  align-items: flex-end;
  justify-content: start;
  margin: 10px 0;
}
.symbiotiq-form-control label {
  font-family: "Open Sans", sans-serif;
  margin-bottom: -5px;
  font-size: 1.5rem;
}
.symbiotiq-form-control input {
  padding: 0;
  border: none;
  border-bottom: solid #262626 1.5px;
  margin-top: 0;
  background: transparent;
  margin-left: 8px;
  width: 100%;
  outline: none;
}
.symbiotiq-form-control input:focus {
  border: none;
  border-bottom: solid #495f76 1.5px;
  outline: none;
}

.symbiotiq-form-control-checkbox label {
  font-family: "Open Sans", sans-serif;
  font-size: 1.5rem;
}
.symbiotiq-form-control-checkbox input.file-upload {
  padding: 0;
  outline: none;
  border-radius: 0;
  margin-top: 0;
  background: transparent;
  transform: scale(1);
  margin-right: 0;
}
.symbiotiq-form-control-checkbox input.file-upload:after {
  border: none;
}
.symbiotiq-form-control-checkbox input {
  padding: 0;
  outline: none;
  border-radius: 2px;
  margin-top: 0;
  background: transparent;
  transform: scale(1.5);
  margin-right: 0.5rem;
}
.symbiotiq-form-control-checkbox input:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 2px;
  border: 2px solid #495f76;
}
.symbiotiq-form-control-checkbox input:focus {
  border: none;
  border-bottom: solid #495f76 1.5px;
  outline: none;
}

.the-process h3 {
  color: white;
  text-decoration: underline;
  font-weight: bold;
  letter-spacing: 1px;
}
.the-process a {
  color: #c2f1dc;
  font-size: 1.2rem;
}
.the-process a:hover {
  color: white;
}
.the-process p {
  color: white;
  font-size: 1.2rem;
  letter-spacing: 1px;
}
.the-process img {
  width: 100%;
}

.wear-details h2 {
  font-size: 2.5rem;
}
.wear-details p {
  font-size: 1.5rem;
}
.wear-details img {
  width: 100%;
}

#featured-products-cta .product-box.gallery img {
  height: 480px;
}

@media (min-width: 768px) {
  #featured-products-cta .product-box.gallery img {
    height: 660px;
  }
}
@media (min-width: 992px) {
  #featured-products-cta .product-box.gallery img {
    height: 280px;
  }
}
@media (min-width: 1200px) {
  #featured-products-cta .product-box.gallery img {
    height: 340px;
  }
}
ul.recipe-directions-list {
  margin-top: 0;
  margin-bottom: 1rem;
  list-style: none;
  padding-left: 0;
}
ul.recipe-directions-list input {
  display: none;
}
ul.recipe-directions-list label {
  font-size: 1.2rem;
  cursor: pointer;
}
ul.recipe-directions-list label i {
  font-size: 1.5rem;
}
ul.recipe-directions-list .checked p {
  text-decoration: line-through;
}
ul.recipe-directions-list .checked label, ul.recipe-directions-list .checked p {
  color: gray;
}
ul.recipe-directions-list .checked label i, ul.recipe-directions-list .checked p i {
  color: #495f76;
}

.recipe-ingredients-list {
  margin-top: 0;
  margin-bottom: 1rem;
  list-style: none;
  padding-left: 0;
}
.recipe-ingredients-list label {
  cursor: pointer;
}
.recipe-ingredients-list .checked {
  color: gray;
}
.recipe-ingredients-list .checked i {
  color: #495f76;
}

.recipe-banner {
  height: 230px;
  width: 100%;
  object-fit: cover;
}
@media (min-width: 992px) {
  .recipe-banner {
    height: 200px;
  }
}

.hacks_list .img-hover-zoom {
  height: 200px;
  width: 200px;
}

footer {
  background: #232323;
  padding: 5rem 0;
}
footer h4 {
  color: white;
  font-weight: bold;
  letter-spacing: 1px;
}
footer a {
  color: white;
  font-size: 1.2rem;
  letter-spacing: 1px;
}
footer a:hover {
  color: white;
}
footer img {
  width: 100%;
  max-width: 160px;
}
footer ul {
  list-style: none;
  padding-left: 0;
}
footer ul li {
  line-height: 1.7;
}

/*# sourceMappingURL=style.css.map */