@custom-media --viewport-sm (min-width: 480px);
@custom-media --viewport-md (min-width: 768px);
@custom-media --viewport-lg (min-width: 992px);
@custom-media --viewport-xl (min-width: 1200px);

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {}


:root {
  --color-plum: #a0144f; /*#903359*/
  --color-plum-rgb: 160 20 79;
  --color-peach: #ff8101;
  --color-tomato: #a52c10;
  --color-kiwi: #119b00;
  --color-salad: #ccfb7f;

  --font-condenced: 'Ristretto';
  --font-head: 'Cocon';
}

::selection {
  background-color: var(--color-salad);
  color: #237a37;
}


@font-face {
    font-family: 'Cocon';
    src: url('/fonts/Cocon/cocon.eot');
    src: url('/fonts/Cocon/cocon.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Cocon/cocon.woff2') format('woff2'),
         url('/fonts/Cocon/cocon.woff') format('woff'),
         url('/fonts/Cocon/cocon.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.font-head {
  font-family: var(--font-head), sans-serif!important;
}

@font-face {
    font-family: 'Ristretto';
    src: url('/fonts/Ristretto/ristrettopro-regular.eot');
    src: url('/fonts/Ristretto/ristrettopro-regular.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Ristretto/ristrettopro-regular.woff2') format('woff2'),
         url('/fonts/Ristretto/ristrettopro-regular.woff') format('woff'),
         url('/fonts/Ristretto/ristrettopro-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.font-condenced { font-family: var(--font-condenced), sans-serif!important; }

.fs-xs { font-size: 0.9em; }
.mb-70 { margin-bottom: 70px;}

/* COLORS */

.color-plum { color: var(--color-plum); }
.color-tomato { color: var(--color-tomato); }
.color-peach { color: var(--color-peach); }
.color-kiwi { color: var(--color-kiwi); }

h1, h2, h3, h4,
h1 a, h2 a, h3 a, h4 a { color: var(--color-kiwi); }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover,
h1 a:focus, h2 a:focus, h3 a:focus, h4 a:focus,
.nav-link:focus, .nav-link:hover, .nav-link.active {
    color: var(--color-peach);
}
.nav-link { color: #fff; }
.text-shadow { text-shadow: 1px 1px 4px black; }
h1, h2, h3 { font-family: 'Cocon', sans-serif!important; }

/* LINKS & BUTTONS */

a.link-plum {
  text-decoration-color: #dfc6d0 !important;
  text-underline-offset: 0.25em !important;
  text-decoration: underline;
  color: var(--color-plum) !important;
}

a.link-plum:hover {
  text-decoration-color: rgba(var(--color-plum-rgb), 0.75) !important;
  color: rgb(255 0 107) !important;
}

.btn-plum, 
.btn-outline-plum:hover,
.btn-plum:hover,
.btn-plum:active {
  color: #fff;
  background-color: var(--color-plum);
}
.btn-plum, .btn-outline-plum:hover {
  border-color: #720936;
}
.btn-plum:hover {
  box-shadow: inset 0px 7px 10px 0px #c722db, 0px 2px 7px #787777;
  border-color: #a304a3;
}
.btn-plum:active,
.btn-outline-plum:active,
.btn-outline-warning:active {
  box-shadow: inset 0 -2px 10px 0px var(--color-tomato);
  background-color: var(--color-peach) !important;
  border-color: var(--color-tomato) !important;
  color: var(--color-tomato) !important;
}
.btn-outline-plum {
  color: var(--color-plum);
  background-color: #fff;
  border-color: var(--color-plum);
}

.btn-action {
    background: rgb(38,191,45);
    background: -moz-linear-gradient(top, rgba(38,191,45,1) 0%, rgba(227,237,49,1) 100%);
    background: -webkit-linear-gradient(top, rgba(38,191,45,1) 0%,rgba(227,237,49,1) 100%);
    background: linear-gradient(to bottom, rgba(38,191,45,1) 0%,rgba(227,237,49,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26bf2d', endColorstr='#e3ed31',GradientType=0 );
    border: 1px solid green !important;
    color: green !important;
    text-shadow: 1px 1px 11px #c9fbc6;
    text-decoration: none !important;
}
.btn-action:hover {
  background: linear-gradient(to bottom, rgb(38 226 47) 0%,rgb(249 224 10) 100%);
    background: -moz-linear-gradient(top, rgba(38,226,47,1) 0%, rgba(249,224,10,1) 100%);
    background: -webkit-linear-gradient(top, rgba(38,226,47,1) 0%,rgba(249,224,10,1) 100%);
    background: linear-gradient(to bottom, rgba(38,226,47,1) 0%,rgba(249,224,10,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26e22f', endColorstr='#f9e00a',GradientType=0 );
    box-shadow: 1px 1px 7px 0px rgba(0, 8, 0, 0.5);
    color: #014a01;
}
.btn-action:active {
    box-shadow: inset 1px 1px 7px 0px rgba(0, 8, 0, 0.5);
    color: #014c12 !important;
    /*background: rgb(38,191,45)!important;*/
}






/* LAYOUT */
@media screen and (min-width: 768px) {
  .px-lg-100 { width: 100px!important; }
}
.logo h1 {
  font-family: 'Cocon', Arial, sans-serif;
  color: #ff8101;
  text-shadow: 1px 1px 0 #8a1626;
  font-weight: 900;

  font-size: 2em;
  padding: 0;
  display: block;
  margin-top: -9px;
  margin-left: 3px;
}




/* DROPDOWN */
.dropdown-menu-xl { width: 650px; }
.dropdown-menu-lg { width: 550px; }
.dropdown-menu-md { width: 300px; }

@media (max-width: 991px) {
  .dropdown-menu-xl, .dropdown-menu-lg, .dropdown-menu-md { width: 100%; }
}
.dropdown-menu h4 a {
  font-family: var(--font-condenced);
  text-decoration: none;
  border-radius: 3px;
}
a.dropdown-item { padding-left: 5px; }
a.dropdown-item:hover { background-color: #fff9c4; }
a.dropdown-item.active:hover { 
  background-color: #ccfb7f; 
  cursor: default;
}
a.dropdown-item.active, 
a.dropdown-item:active {
  background-color: #ccfb7f;
  color: #237a37;
}





/* LANDING ONLY */
.farmhero {
  background: #593142 url("../img/cover/cover01_400.webp") no-repeat center center;
  height: 100vh;
  background-size: cover;
  /*min-height: 600px;*/
}
@media (orientation:landscape) and (max-width: 767px) {
  .farmhero {
    background-image: url("../img/cover/cover01_560.webp");
  }
}
@media (min-width: 768px) {
  .farmhero {
    /*background-image: image-set( 
      "../img/cover/cover01_960.webp" 1x, 
      "../img/cover/cover01_1440.webp" 2x, 
      "../img/cover/cover01_1920.webp" 3x
    );*/
    background-image: url("../img/cover/cover01_960.webp");
    height: 600px;
  }
}
@media (min-width: 992px) {
  .farmhero {
    background-image: url("../img/cover/cover01_1440.webp");
    height: 700px;
  }
}
@media (min-width: 1200px) {
  .farmhero {
    background-image: url("../img/cover/cover01_1920.webp");
    height: 800px;
  }
}
.farmhero::before {
    content: '';
    width: 100%;
    height: 80%;
    display: block;
    background: linear-gradient(180deg, rgb(0 0 0 / 90%) 0%, rgba(0, 0, 0, 0) 64%);
}

.phone-frame {
  position: absolute;
  bottom: 0;
  right: 50px;
  right: 50px;
  width: 400px;
  height: 400px;
  border-top-left-radius: 40px;
  border-top-right-radius: 40px;
  border: solid 3px white;
  border-bottom: none;
  background-color: rgb(255 255 255 / 40%);
  box-shadow: inset 1px 3px 15px antiquewhite;
}

#carouselBaskets .owl-card {
  background-color: white;
  /* margin: 5px; */
  width: 100px !important;
  height: 145px;
  position: relative;
  display: block;
  text-align: center;
  font-size: 16px;
  font-family: "Ristretto";
  color: var(--color-kiwi);
  border: solid 5px white;
  border-radius: 10px;
}
#carouselBaskets .owl-card:hover {
  color: var(--color-peach);
  border-color: var(--color-salad);
}
#carouselBaskets .owl-card img {
  border-radius: 5px;
}
#carouselBaskets .owl-card span {
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  height: 45px;
}
.phone-frame .owl-prev, .phone-frame .owl-next {
  border: none;
  border-radius: 30px;
  margin-right: 5px;
}



.invalid-feedback {
  display: block;
  font-size: 12px;
}

.panel-white {
  padding: 10px;
  border-radius: 10px;
  background-color: rgb(255 255 255 / 25%);
}

.panel-white .invalid-feedback {
  background-color: rgb(253 232 232 / 70%);
  padding: 5px;
  border-radius: 5px;
}















/* OLD STYLES */

.slider .title {
	margin-bottom: 60px;
}

/*
header.viewport-lg + #page #hero-1 .slider {
	padding-top:120px;
}
header.viewport-lg .navik-menu .dropdown_menu > a,
header.viewport-lg .navik-menu .total-cart > a,
.logo h1,
.slider {
	text-shadow: 1px 1px 0 #8a1626;
}
header.viewport-lg .navik-menu {
	transform: translate(37px);
}

header:not(.viewport-lg) nav.scrollable {
	overflow-y: auto;
	overflow-x: hidden;
  height: 90vh;

}
header:not(.viewport-lg) {
	min-height: 80px;
}
*/
.tra-peach-hover:hover {
    color: #ffffff!important;
    background-color: #ff8101!important;
    border-color: #af5012!important;
    box-shadow: 1px 1px 4px 1px rgb(76 75 75 / 58%);
}
.tra-peach-hover:focus {
    color: #ffffff!important;
    background-color: #ff8101!important;
    border-color: #af5012!important;
}
.tra-peach-hover:active {
    color: #ffffff!important;
    background-color: #ff8101!important;
    border-color: #af5012!important;
    box-shadow: inset 1px 1px 4px 1px rgb(76 75 75 / 58%);
}

@media (min-width: 768) {
	.navik-menu li.mega-menu > ul.two-column {
    	width: 768px !important;
	}
}



@media (max-width: 1200px) { 
	section#hero-1,
	section#hero-1 .slider,
	section#hero-1 ul.slides li {
		min-height: 100vh;
	}
}

.overlay {
  width: 100%;
  height:100%;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 25px;
}
.slide-up {
	overflow: hidden;
}
.slide-up .overlay {
  	background: rgb(4,0,68);
	background: -moz-linear-gradient(0deg, rgba(4,0,68,1) 0%, rgba(34,0,56,0.2987570028011205) 100%);
	background: -webkit-linear-gradient(0deg, rgba(4,0,68,1) 0%, rgba(34,0,56,0.2987570028011205) 100%);
	background: linear-gradient(0deg, rgba(4,0,68,1) 0%, rgba(34,0,56,0.2987570028011205) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#040044",endColorstr="#220038",GradientType=1);
  	color: #fff;
  	transform: translateY(100%);
  	-webkit-transition: transform 0.5s ease-out;
  	-o-transition: transform 0.5s ease-out;
 	transition: transform 0.5s ease-out;
}

.slide-up:hover .overlay{
  transform: translateY(0);
}

.plum-color {
	color: #903359!important;
}

.abox-2-wrapper i, .abox-2-wrapper h6 {
	color: #9e9e9e;
}
.abox-2-wrapper .row > div:hover i, .abox-2-wrapper .row > div:hover h6 {
	color: #903359;
}

.menu-6 h2, .menu-8 h2 {
	font-family: 'Cocon', cursive;
}

/* PRODUCTS */

.products-grid {
	list-style: none;
	padding: 0;
	margin: 0 -10px 0;
}
.products-grid:after {
	content: '';
	display: table;
	clear: both;
}
.product {
	width: 150px;
	margin: 0;
	display: block;
}
.modal .product {
  width: 90px;
}
.product.dormant {
	opacity: 0.7;
}
.product.dormant:hover {
	opacity: 1;
}
.product .product-image-area {
	padding: 5px;
	border: 1px solid #ddd;
	border-radius: 5px;
	margin: 0;
}
.product:hover .product-image-area {
	opacity: 1;
	background-color: #fff7ae;
  border: 1px solid #fbd562;
}
.product.active .product-image-area {
	opacity: 1;
	box-shadow: 0px 3px 9px rgb(158 158 158 / 60%);
	background-color: #ccfb7f;
  border: 1px solid #9cbf63;
}
.modal .product:hover .product-image-area,
.modal .product.active .product-image-area {
  background-color: #fff;
  border: 1px solid #ddd;
}

.product .product-image-area {
	position: relative;
}
.product.active .product-image-area:after,
.product:hover .product-image-area:after {
    content: url(/cdn/img/icons/plus-circle-solid.svg);
    position: absolute;
    width: 50%;
    left: 25%;
    top: 25%;
    opacity: 0.6;
    pointer-events: none;
}
.modal-body .product.active .product-image-area:after,
.modal-body .product:hover .product-image-area:after {
    content: '';
    position: absolute;
    width: 0;
    left: 0;
    top: 0;
    opacity: 0;
}

.product-details-area {
	text-align: center;
}

/* OWL CRUSEL */

.products-grid.owl-carousel .owl-theme {}
.owl-loaded {}
.owl-loading {}
.owl-stage-outer {}
.owl-stage {}
}
.owl-nav {}
.owl-prev {}
.owl-next {}
.owl-dots {}
.owl-dot.active {}
.owl-dot {}
.owl-height {}

.products-grid .owl-item {
  width: 150px ;
}
.product .product-name {
  font-size: 20px!important;
}
.product:hover .product-name {
  	color: #ff8101;
}
.product.active .product-name {
	color: #e3000e;
}

li.empty_item {
	list-style: none;
	text-align: center;
	width: 100%;
	min-height: 237px;
}
#farmstock-content.show {
	min-height: 237px;
}

#formSearch input#id_search {
	font-size: 28px;
    padding: 5px 0 5px 15px;
    height: 62px;
    line-height: 32pt;
}

.input-group .fa-plus, .input-group .fa-minus {
  cursor: pointer;
}




/* ICONS */
ul.messenger-icons img,
ul.social-icons img {
  width: 52px;
  opacity: 1;
}
ul.messenger-icons li:hover img,
ul.social-icons li:hover img {
  opacity: 0.8;
}
ul.messenger-icons img,
ul.social-icons li {
  margin: 5px;
}



/* UTILITIES */

.h-90px { height: 90px; }
.form-floating.input-group label { z-index: 100; }

.modal-header button {
	width: 28px;
}
.modal-header.bg-danger button {
	border: 1px solid #e65462;
    background-color: #a51624;
}
.modal-header.bg-success button {
	border: 1px solid #22a066;
    background-color: #085d35;
}



.ajax_load {
  background-image: repeating-linear-gradient(-45deg, #c9d5ea, #c9d5ea 15px, #d4f9b5 15px, #d4f9b5 25px)!important;
  -webkit-animation:progress 1s linear infinite;
  -moz-animation:progress 1s linear infinite;
  -ms-animation:progress 1s linear infinite;
  animation:progress 1s linear infinite;
  
  -webkit-background-size: 70px 70px;
     -moz-background-size: 70px 70px;
      -ms-background-size: 70px 70px;
          background-size: 70px 70px;
}
button.ajax_load, a.btn.ajax_load {
    cursor: progress;
    color: #6c757d;
}

@-webkit-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
}
@-moz-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
}    
@-ms-keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
}    
@keyframes progress{
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -70px 0px;
  }
} 


.hero-phone {
  min-height: 280px;
}
.hero-phone #formPhone {
  position: relative;
}
.hero-phone #code_selection {
  position: absolute;
  top: 107px;
  left: 0;
}

.select2-results .phone-code,
.hero-phone .phone-code {
    margin: 0 5px 0 5px;
    font-weight: 600;
    width: 50px;
    display: inline-block;
    text-align: right;
}

.btn-outline-secondary {
    color: #6c757d;
    border: 1px solid #6c757d!important;
}
/*
.btn-outline-secondary:not(.dropdown-toggle):focus,
.btn-outline-secondary:not(.dropdown-toggle):active:focus {
  color: #fff;
}
*/
.btn-outline-secondary:hover:focus,
.btn-outline-secondary:active:focus,
.btn-outline-secondary.show:focus {
  color: #fff!important;
}
.btn-outline-secondary:focus {
    color: #6c757d!important;
}

#subscribe-1 {
  background-image: url(../../img/front/eggs.jpg);
  position: relative;
  z-index: 0;
  box-shadow: inset 0px 30px 100px 12px black;
}
.shaded {
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgb(0 0 0 / 50%);
  bottom: 0;
  right: 0;
  z-index: -1;
}
#subscribe-1 img {
  width: 500px;
  height: 507px;
}

.shadowed {
    box-shadow: inset 0px 100px 100px 50px rgb(43 0 40 / 80%);
    background-blend-mode: darken;
    background-color: rgb(0 0 0 / 60%);
}

/* OWL CATEGORIES */
#menu-8 .owl-stage {
  margin-top: 8px;
}
#menu-8 .owl-nav {
    position: absolute;
    width: 100%;
    height: 190px;
    top: 0;
    pointer-events: none;
}
#menu-8 .owl-prev,
#menu-8 .owl-next  {
    position: absolute;
    top: 0;
    width: 40px;
    height: 190px;
    pointer-events: all;
}
#menu-8 .owl-prev {
    left: 0;
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
}
#menu-8 .owl-next  {
    right: 0;
background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.01) 1%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(255,255,255,1) 100%);
background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );
}
#menu-8 .owl-prev:hover {
    background-color: #f5f5f5;
    border-radius: 0 15px 15px 0;
    border-right: 1px solid #c9c9c9;
}
#menu-8 .owl-next:hover  {
    background-color: #f5f5f5;
    border-radius: 15px 0 0 15px;
    border-left: 1px solid #c9c9c9;
}
#menu-8 .owl-prev.disabled,
#menu-8 .owl-next.disabled  {
    display: none;
    pointer-events: none;
}
#menu-8 .owl-prev i {
    margin-left: -30px;
}
#menu-8 .owl-next i {
    margin-right: -30px;
}
#menu-8 .owl-prev:hover i,
#menu-8 .owl-next:hover i {
    color: #d3332c;
    -webkit-transition: transform 0.5s ease-out;
    -o-transition: transform 0.5s ease-out;
  transition: transform 0.5s ease-out;
}
#menu-8 .owl-prev:hover i {
    transform: translateX(-50%);
}
#menu-8 .owl-next:hover i {
    transform: translateX(50%);
}



/* Toggle Collapse Caret */

a[data-bs-toggle="collapse"] {
  position: relative;
}
a[data-bs-toggle="collapse"] i {
  position: absolute;
  top: -5px;
}