:root {
       --gc_green: 20,41,29;
}

@media screen and (min-width : 1200px)
{
:root {
      --header_height: 140px;
      --footer_height: 140px;      
      --site_width: 1200px;
} 
.menu {left:24vw; font-size: 1.7rem; width:800px;}    
.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 {width:15vw; left:3vw;  min-width:225px;} 
.banner {height:200px;}
.range {height:350px;}
.range_text {height:40px;} 

}    

@media screen and (min-width : 830px) and (max-width : 1199px)
{
:root {
      --header_height: 100px;
      --footer_height: 140px;
      --site_width: 830px;
}
.desktops_only {display:none!important;}      
.menu {left:23.5vw; font-size: 1.4rem; width:67.5vw; max-width:650px;}  
.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; left:0px; } 
.banner {height:150px;}  
.range {height:290px;}
.range_text {height:60px;}

}  

@media screen and (min-width : 830px)
{
.mobile_only {display:none!important;} 
.menu {text-align:center; border-top:6px solid #245B48; border-bottom:6px solid #245B48;position:absolute; bottom:10px}
.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;}
.title {font-size:4rem;}
.subtitle {font-size:3rem;}

.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%;}
.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;}
}


@media screen and (max-width : 829px)
{
:root {
      --header_height: 100px;
     --footer_height: 150px; 
      --site_width: 95%;
}    
    
.desktops_only {display:none!important;}      
.tablets_only {display:none!important;}    

.header_logo {width:150px; left:0px; top:0px;} 
.header { border-top:5px solid rgb(var(--gc_green)); background-repeat:no-repeat; background-position: center;  background-size:100%; border-bottom:5px solid rgb(var(--gc_green)); box-sizing:border-box;}    
.mobile_menu_button {width:40px; position:absolute; right:10px; bottom:5px;}

.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_image img {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;} 

.title {font-size:2.7rem;}
.subtitle {font-size:2.2rem;}
.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 : 350px) and (max-width : 829px)
{
.range {height:290px;}
.range_text {height:80px; padding:0 10px;}

}

@media screen and (max-width : 349px)
{
.not_for_phones {display:none!important;}
.range {height:275px;}
.range_text {height:80px; padding:0 5px;}   
} 


.column_list {column-width:250px;}
.column_list > div {padding:2px 0;}

.set_width {min-width: var(--site_width); max-width:1920px; margin: 0 auto;text-align:center;}
.set_width > div {padding:0 calc((100vw - var(--site_width)) / 2); box-sizing:border-box; text-align:left;}
.main {padding-top:var(--header_height); width:100%; box-sizing:border-box; min-height: calc(100vh - 50px);}
.header {position:fixed; height:var(--header_height); width:100vw; box-sizing:border-box; background-color:rgb(var(--gc_green)); color:#fff;  text-align:left; z-index: 99;}
.header_logo {position:absolute; max-width:200px;}
.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;}
.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_address {position:absolute;}
.footer_contacts{position:absolute;}
.footer_menu {position:absolute;}
.footer_info {position:absolute;}

.title { padding:10px 0px 5px 0px; text-shadow: 2px 2px 5px gray; border-bottom:2px solid rgb(var(--gc_green)); margin-bottom: 5px;}
.subtitle {padding:5px 0px; text-shadow: 2px 2px 5px gray;}
.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}



/*

.gc_light_green {color:#b9d533!important;}
.gc_range_button {border:2px solid #b9d533; margin:0 3px; width:125px; height:50px; color:rgb(var(--gc_green)); text-align:center; font-family:rubik; font-size:1.6rem; vertical-align: top; border-radius:5px;box-sizing: border-box;}
.gc_range_button_item_inner {vertical-align:middle; display:table-cell; height:50px;box-sizing: border-box; line-height:1.2}


.search_box {color:#111; border-radius:3px; background-color:#f0f0f0; text-align:right; font-size:2rem;}
.search_button {color:#666; border-left:1px solid #888; border-right:2px solid #888; border-top:solid 1px #888; border-bottom:2px solid #888; border-radius:5px; line-height:1.1; padding:3px; background-color:#efefef; box-shadow:0px 0px 1px #666; display:block;}
.search_button:active {color:#333; border-left:2px solid #999; border-right:1px solid #999; border-top:solid 2px #999; border-bottom:1px solid #999;  background-color:#dfdfdf; box-shadow:0px 0px 1px #888;}

.input_checkbox {visibility: hidden;}
.input_checkbox + label {cursor:pointer;}
.input_checkbox + label:before {background-color: #f0f0f0; border: 1px solid #cfcfcf; border-radius:2px; content: "\00a0"; display: inline-block; font-size: 16px; height: 20px; padding: 0; vertical-align: top; width: 20px; margin-left: -20px;}
.input_checkbox:checked + label:before {background-color: #f0f0f0; color: #444; content: "\2713"; text-align: center;}




.core_content {display:contents;}
.content_section {padding:0;}
.content_type_70 {}



.range_menu_fix {position:fixed; z-index:99; }
.range_menu {width:100%; display:inline-block; background-color:#f0d95c; box-shadow:0px 0px 5px #000;}
.range_menu_item {display:inline-block; width:calc(100% / 6);}
.range_menu_height{height:40px;}
.selected_range{background-color:rgb(var(--gc_green)); color:#fff; border-color:#fff;}
.product_delete {width:20px;}

.basket_totals {margin:10px 0; padding:10px 0; border-top:2px solid #efefef; border-bottom:2px solid #efefef;}
.basket_total {width:100px; padding-right:40px; text-align:right; vertical-align: top; }

.product_info {width:100%; height:250px; border:5px solid #dfdfdf; box-sizing:border-box; background-color:#fff;}


.top_basket {position:absolute; right:20px; width:200px; top:10px; }
.top_basket a {color:#fff;}

.top_basket_inner {position:relative; width:200px; height:75px; margin-right:10px}

.basket_image {position:absolute;width:100px; left:calc((200px/2) - (100px / 2))}
.basket_image img {width:100%;}
.basket_value {display:table; font-size:2.5rem; font-weight:bold; color:#fff; text-align:center; height:75px;  margin-top:15px; width:100%; background-color:rgba(29,75,61,0.5); position:absolute; z-index:10;}
.basket_message {font-size:1.3rem; padding-top:0px;}
.top_message {position:absolute; bottom:10px; font-size:2rem; width:240px;  right:0px; padding:5px; text-shadow: 2px 2px 5px #000; box-sizing:border-box;}
.discount_info {position:absolute; bottom:10px; font-size:2rem; width:210px; left:20px; padding:5px;  text-shadow: 2px 2px 5px #000; box-sizing:border-box;}
.shipping_info {position:absolute; top:0px; left:20px; width:120px; height:120px; background-image:url('/images/site/star.png'); background-size: cover;  background-repeat: no-repeat;}
.shipping_info_inner {position:absolute; top:28px; left:-10px; width:150px; font-size:2rem; line-height:1.2; text-shadow: -1px -1px 0 #fff,  1px -1px 0 #fff,  -1px 1px 0 #fff,  1px 1px 0 #fff;  transform: rotate(-19deg); color:rgb(var(--gc_green)); text-align:center;}

.purchase_form {margin:20px auto; text-align:center; width:850px;}
.purchase_form input {font-size:2rem;}
.purchase_form button {background-color:rgb(var(--gc_green)); color:#fff; font-weight:bold; padding:5px; border:0px;}

.payment_method {height:195px; width:850px; background-color:#efefef; box-sizing:border-box;}
.sage_pay {background-color:#41a940; color:#fff; height:195px;}
.cvv {margin-left:2px; font-weight:bold; display:inline-block; text-align:center; background-color:#b9d533; color:#fff; width:24px; height:24px; border-radius:12px;}

.pm { padding:5px; border-top-right-radius: 5px; border-top-left-radius: 5px}

.address {width:100%;}

.special_offers {border-bottom:5px solid #ef1515; margin: 0 10px; box-sizing: border-box;}
.special_offer_title {background-color:#ef1515;  text-shadow:  5px 5px 5px #555; color:#fff; font-family:green_cuisine; font-size:3rem; border-top:5px solid #ef1515; border-bottom:5px solid #ef1515;}
.free_gift {color:#ef1515;}
.free_gift_row {background-color:#b9d533;}


.tandc {padding:0 5px;}
.tandc li {margin-bottom:30px;}


.err_ul {margin:15px 0 15px 20px; list-style-type: disc;  }
.err_ul li {list-style-position: outside; padding:0 0 5px 0px;}

*/

