body { background-color:rgb(var(--gc_green));} 
svg.logo {width:100%; height:100%; stroke:rgb(var(--gc_green)); stroke-width:0px}
.logo path.green { fill: rgb(255,255,255);  stroke-width:1px}
.logo g.cuisine { fill: rgb(255,255,255);}
.logo path.leaf { fill: rgb(255,255,255); }
.set_width {margin: 0 auto; background-color:#fff;} 
.set_width > div {box-sizing:border-box;}


@media screen and (min-width : 1201px)
{
:root {
      --header_height: 145px;
      --footer_height: 140px;      
      --site_width: 1200px;
} 


.menu {left:calc(50% - 350px); font-size: 1.7rem; width:700px; bottom:20px}    
.menu_button {padding:0 10px; max-width:140px; height:54px;}
.header_trade_link {height:175px; width:175px; height:clamp(175px, 13vw, 200px); width:clamp(175px, 13vw, 200px);}    
.header_trade_text {font-size:clamp(8px, 1.1vw, 18px); line-height: 1.25em; left:86%; width:76%; }
.header_trade_image {width: 30%; max-width:80px;right: -12px;top: 3px;}   
.header_logo {left:2vw; top:25px; width:200px;} 
.top_basket {right:2.5vw; width:50px; height:50px; top:20px;}
.banner {height:300px;}
.range {height:350px;}
.range_text {height:40px;} 
.images.ranges > .image {max-width:500px}

}
    
@media screen and (max-width : 1200px)
{
.set_width > div {padding:0 calc((100vw - var(--site_width)) / 2); box-sizing:border-box; text-align:left;}
}

@media screen and (min-width : 831px) and (max-width : 1200px)
{
:root {
      --header_height: 125px;
      --footer_height: 140px;
      --site_width: 95%;
}
.desktops_only {display:none!important;}      
.menu {left:23.5vw; font-size: 1.4rem; width:67.5vw; max-width:650px; bottom:20px}  
.menu_button {padding:0 5px; max-width:110px; height:46px; }
.header_trade_link {height:150px; width:150px; height:clamp(100px, 17vw, 400px); width:clamp(100px, 17vw, 400px);}  
.header_trade_text {font-size:clamp(8px, 1.5vw, 18px); line-height: 1.3em; left:86%; width:77%; }
.header_trade_image {width: 30%; max-width:80px;right: -12px;top: 3px; }
.header_logo {width:165px; top:25px; left:10px; } 
.top_basket {left:max(722px, 87vw); width:40px; height:40px; bottom:25px;}
.banner {height:250px;}
.range {height:290px;}
.range_text {height:60px;}
.images.ranges > .image {max-width:500px}
}  


@media screen and (min-width : 831px)
{
.set_width {width: 90%; max-width:1920px; margin: 0 auto; background-color:#fff;} 
.set_width > div { padding:0 10px;}

  
.mobile_only {display:none!important;} 
.menu {text-align:center; border-top:2px solid rgb(var(--gc_spice)); border-bottom:2px solid  rgb(var(--gc_spice));position:absolute; background-color:rgba(122,26,0,0.7);}
.menu_button {vertical-align:middle; color:#fff; font-family: rubik; box-sizing:border-box; display:inline-flex; align-items:center;}
.menu_button a {color:#fff;}
.menu_button_free {top:-17px; font-weight:bold; right:0; font-size:1.8rem;} 
.header_trade_link {position:fixed; right:0; top:0; clip-path: polygon(0% 0, 100% 0, 100% 100%);  padding:0px; z-index:101;}
.header_trade_text {top:0%; transform:translateX(-50%) rotate(45deg); transform-origin: 0 0;}
.header_trade_image {transform: rotate(23deg);}
.footer_address {left:5px; top:5px;}
.footer_contacts{left:150px; top:47px;}
.footer_menu {top:5px; right:5px;}
.footer_info {bottom:5px; right:5px; text-align:right;}


.front_page_welcome_text {}
.front_page_welcome h1{font-size:4rem;} 


.range { width:calc(100% - 10px); max-width:calc(50% - 20px);}
.range h2 {font-size:2rem; margin-bottom:10px;}
.range_image {width:100%; max-width:750px;}
.range_image img {width:100%;}
.range_text {font-size:1.5rem; padding:0 10px;}
.commodity_photo {width:200px; height:200px;}
.gift_image {max-height:225px; max-width:300px;}
.gift_text {font-size:1.6rem;}
.gift_title {font-size:2.2rem;}

.category_section {}


.top_basket_inner {position:relative; width:100%; height:100%; margin:0px;}
.basket_value{height:100%;}


}


@media screen and (max-width : 830px)
{
:root {
      --header_height: 100px;
     --footer_height: 150px; 
      --site_width: 95%;
}    
    

.header_logo {width:125px; left:10px; top:25px;} 
.header {background-repeat:no-repeat; background-position: center;  background-size:100%; box-sizing:border-box;}    
.mobile_menu_button {position:absolute; right:10px; bottom:15px;}

.menu {display:none; position:absolute; top:calc(var(--header_height) - 6px); height:calc(100vh - var(--header_height) - 10px); right:0px; background-color:rgb(var(--gc_green)); padding:10px}
.menu_button {border-bottom:3px solid #245B48; padding:3px 20px 3px 0; text-indent:10px;}
.menu_group .menu_button:first-of-type {border-top:3px solid #245B48;}
.menu_button div {display:inline-block; margin-left:3px; text-indent:0px;} 
.menu_button_free {font-size:1.2rem; top:-5px; right:0;}

.header_trade_link {height:70px; margin:20px 0;}  
.header_trade_text {width:150px; top:2px; right:10px;}
.header_trade_image {width:60px; top:2px; left:15px;  transform: rotate(19deg);}

.range { width:calc(100% - 10px); max-width:350px;}
.range h2 {font-size:2rem; margin-bottom:10px;}
.range_image {width:100%;}

.range_text {font-size:1.5rem;}


.footer_address {left:5px; top:5px;}
.footer_address div {display:inline-block;}
.footer_contacts{left:5px; top:60px;}
.footer_menu {top:5px; left:5px;}
.footer_info {bottom:5px; left:5px;}
.front_page_welcome_text {margin-bottom:10px;}
.front_page_welcome h1{font-size:5.5vw;} 


.commodity_photo {width:150px; height:150px;}
.gift_image {max-height:180px; max-width:240px;}
.gift_text {font-size:1.5rem;}
.gift_title {font-size:1.7rem;}

} 


@media screen and (min-width : 351px) and (max-width : 830px)
{

.set_width > div { padding:0 10px;}

.banner {height:200px;}
.range {height:290px;}
.range_text {height:80px; padding:0 10px;}
.images.ranges > .image {width:100%; max-width:500px}

.mobile_menu_button {width:40px;}
.top_basket {right:5px; width:40px; height:40px; top:0px;}
.top_basket_inner {position:relative; width:100%; height:100%; margin:0px;}
.basket_image {width:50px; right:0px;}
.basket_value{right:12px; top:22px; width:26px; height:20px; line-height:20px;}


}


@media screen and (max-width : 350px)
{

.banner {height:175px;}
.range {height:275px;}
.range_text {height:80px; padding:0 5px;}  
.images.ranges > .image {max-width:95%;}

.mobile_menu_button {width:40px;}
.top_basket {right:5px; width:40px; height:40px; top:0px;}
.top_basket_inner {position:relative; width:100%; height:100%; margin:0px;}
.basket_image {width:50px; right:0px;}
.basket_value{right:12px; top:22px; width:26px; height:20px; line-height:20px;}

} 




.images {text-align:center;}
.images > div {display:inline-block;}
.images.large > div {width:80%; max-width:800px;}
.images.medium > div {width:50%; max-width:600px;}
.images.small > div {width:27%; max-width:400px;}
.images.very_small > div {width:20%; max-width:300px;}
.framed img {padding:20px;}   
 


.uk_only { display:inline-block; padding-left:3px; box-sizing:border-box;}

.show_basket .top_basket {display:block!important;} 







.column_list {column-width:250px;}
.column_list > div {padding:2px 0;}


/**/

.main {width:100%; box-sizing:border-box; min-height: calc(100vh - 50px);}

.top_bar {position:absolute; top:0; left:0; width:100%; height:25px; background-color:#000; color:#fff; text-align:center;}

.basket_image {height:20px;}

.basket_value {font-size:1.5rem; font-weight:bold; color:#fff; background-color:rgb(var(--gc_spice)); height:25px;}
.basket_qty{height:20px; line-height:20px; display:inline-block;}



.header {position:fixed; height:var(--header_height); width:100vw; box-sizing:border-box; background-color:rgb(var(--gc_green),0.45); color:#fff;  text-align:left; z-index: 99;}
.header_logo {position:absolute;}
.header_logo img {width:100%; display:block;}
.header_trade_link {background-color:#000; text-align:center;}
.header_trade_text{position:absolute;}
.header_trade_image {position:absolute; transform-origin: 0 0;}
.menu_button {position:relative;}  
.menu_button_free { color:#b9d533; position:absolute;transform:rotate(20deg);}
.banner {width:100%; display:flex; align-items: flex-end;  padding-bottom:10px; box-sizing: border-box; background-color:rgb(var(--gc_green));}
.banner img {width: 100%;  height: 100%;    object-fit: cover;   object-position: center bottom;}


.footer {box-sizing:border-box; min-height:var(--footer_height); padding:5px;  background-color:rgb(var(--gc_green)); color:#fff; font-size:1.5rem; margin-top:20px;}

.footer_image {height:var(--footer_height);position:absolute; bottom:0; left:0; z-index:0;overflow: hidden}
.footer_image img {opacity:0.5; transform: scaleY(-1);width: 100%; height:var(--footer_height);  object-fit: cover;   object-position: center bottom;}
.footer_address {position:absolute; z-index:1;}
.footer_contacts{position:absolute; z-index:1;}
.footer_menu {position:absolute; z-index:1;}
.footer_info {position:absolute; z-index:1;}

.title {font-size: clamp(2rem, 5vw, 3rem);  padding:10px 0px 5px 0px; border-bottom:2px solid rgb(var(--gc_green)); margin-bottom: 5px;}
.subtitle {font-size: clamp(2rem, 4vw, 2.5rem); padding:5px 0px;}
.gc_underlined {border-bottom:2px solid rgb(var(--gc_green));}
.gc_link {color:#b9d533;text-decoration: underline; text-decoration-color: rgb(var(--gc_green)); font-weight:bold;}



.front_page_welcome {text-align:center; position:relative; padding-top:10px;}
.font_page_welcome h2{color:#b9d533; line-height:0.85; text-shadow:  -2px -2px 0 rgb(var(--gc_green)),    2px -2px 0 rgb(var(--gc_green)),  -2px 2px 0 rgb(var(--gc_green)),   2px 2px 0 rgb(var(--gc_green)), 5px 5px 5px #ddd; font-family:green_cuisine; }
.front_page_welcome h1{color:#b9d533; font-family:green_cuisine; text-shadow:  5px 5px 3px rgb(var(--gc_green)); padding-bottom:5px; }
.front_page_welcome h4 {font-size:2rem;  line-height:1.6; font-family:rubik;}

.range {border:2px solid rgb(var(--gc_green)); border-radius:5px; padding:10px; text-align:center; margin:5px; position:relative; display:inline-table; box-sizing:border-box;}
.range h2 {line-height:1.2; }
.range_image {display:inline-block;}
.range_text {position:absolute; bottom:5px; left:0;}
.range_button {display:inline-block; padding:3px 5px; }
.range_menu {background-color:rgb(var(--gc_green));}

.about_us_img {border:2px solid rgb(var(--gc_green)); margin:0 10px; box-shadow: 4px 4px 5px gray; width:90%; max-width:500px; box-sizing:border-box;}
.commodity_photo {overflow:hidden; border-radius:50%; float:right; margin-left:10px;}
.spice_chart {transform:rotate(5deg);box-shadow:5px 5px 5px #999;}
.gift_box {border:2px solid #b9d533; border-radius:2px; width:100%; max-width:500px; height:365px; box-sizing:border-box; margin:5px; display:inline-block; vertical-align:top!important; align-items:flex-start;}
.gift_image {width:100%; aspect-ratio: 1/0.75; display:inline-flex; align-items:center; justify-content:center;}
.gift_text {height:80px; width:100%; box-sizing:border-box; margin-top:10px; padding:0 5px;  align-items:center;}
.gift_title {text-align:center;}


.postcode_search_box {display:inline-block; width:580px; border:2px solid rgb(var(--gc_green)); border-radius:5px; padding:10px; box-sizing:border-box; min-height:500px; margin-right:10px; vertical-align:top;}
.postcode_search_form {background-color:#245B48; padding:10px; width:100%; box-sizing:border-box; margin:20px 0; color:#fff; border-radius:3px;}
.online_retailers_box {display:inline-block; width:580px; border:2px solid rgb(var(--gc_green)); border-radius:5px; padding:10px; box-sizing:border-box; min-height:500px; margin-left:10px; vertical-align:top;}



.popup_message_div{position:fixed; left: 50%; top: 40%; transform: translate(-50%, -50%); width:80%; max-width:500px; height:80%; max-height:500px; background-color:#fff; color:#000; border:5px solid #b9d533; border-radius:10px; padding:30px; font-size:2rem; box-sizing:border-box; box-shadow: 0px 0px 10px #000; z-index:200;}
.popup_message_corner {position:absolute; top:0px; right:0px; width:26px; height:26px;box-sizing:border-box; background-color:#fff;z-index:202;border-radius: 0 0 0 25px;}
.popup_message_close_div {position:absolute; top:-25px; right:-25px; width:50px; height:50px; box-sizing:border-box; border:5px solid #b9d533; background-color:#fff; border-radius:25px; z-index:201;} 
.popup_message_close {position:absolute; cursor:pointer; top:-25px; right:-25px; width:50px; height:50px; box-sizing:border-box; border-radius:25px; z-index:203; font-size:3rem; color: #dfdfdf; text-align: center; font-weight: bold; font-family: arial; display: inline-block;} 


.popup_message h2 {text-align:center; margin-bottom:6px; font-size:2.5rem;}
.popup_message_div{padding:30px; }
.popup_message {font-size:1.9rem;}
.popup_message_image {width:300px}


.product_title {}
.product_title h2{font-size: clamp(2.5rem, 5vw, 5rem); font-family: "Berkshire Swash", serif; color:rgb(160,135,15);}
.product_name {color:#4c4d68; font-weight:bold;}


.banner.fixed-at-header { position: fixed; left: 0; width: 100%;  z-index: 1;}

.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 10;}