/*
Theme Name: Velo Boxes
Author: unavoided
Version: 1.0
Text Domain: veloboxes
*/

/* Azo Sans font loaded via Typekit in header.php */
    
* {margin:0; padding:0; color:#121211; font-family:"azo-sans-web", sans-serif;   font-weight: 300;}
html { height:100%;}
body {height: 100%; background: #fff;}

h1, .h1 {margin-bottom:3%; font-size: 36px; font-family:"azo-sans-web", sans-serif; font-weight: 700;  }
h2, .h2 {margin-bottom:3%; font-size: 27px; font-family:"azo-sans-web", sans-serif; font-weight: 700;  }
h3, .h3 {margin-bottom:3%; font-size: 24px;}
h4, .h4 {margin-bottom:3%; font-size: 18px;}
p  {margin-bottom:2%; font-size:1em; line-height:1.25em;  }
p em {}
ul, ol {margin-bottom:3%; padding-left:30px; }
strong {font-family:"azo-sans-web", sans-serif; font-weight: 700; }
.statementli li { list-style: none; padding-left: 40px; background:url("images/list.png") no-repeat left center; font-size: 20px; line-height: 40px;}
.content li { list-style: none; padding-left: 25px; background:url("images/list.png") no-repeat left center; background-size: auto 80%; font-size: 1em; line-height:1.5em;}
.keys li { list-style: none; padding-left: 30px; background:url("images/key.png") no-repeat left top; background-size: 20px auto;font-size: 1em; line-height:1.5em; margin-bottom: 20px;}

::placeholder {  color: #4A4A4A;  opacity: 1; }
:-ms-input-placeholder { color: #4A4A4A;}
::-ms-input-placeholder {  color: #4A4A4A;}

.light {font-weight:300}
.regular {font-weight:400  }
.bold {font-weight:700; font-family:"azo-sans-web", sans-serif; font-weight: 700;    }
.heavy {font-weight:700; font-family:"azo-sans-web", sans-serif; font-weight: 700;    }
.textalignright {text-align: right;}
.halfwidth .size-large {filter: grayscale(100%);}


.mega {font-size: 80px;}
.smalltext {font-size: 13px;}
.bigpee p {font-size: 18px;}

a {  color: #d01317;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
a:hover { text-decoration: underline;}

.gform_button, .gform_previous_button, .gform_next_button { padding:2% 6%; background:#d01317;  color:#fff; border: none; font-weight: 300; font-size:16px;  border-radius: 5px;  line-height:2em; letter-spacing: 2px; display:inline-block; margin-top:3%; text-transform:uppercase;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease; cursor: pointer;}
.gform_button:hover, .gform_previous_button:hover, .gform_next_button:hover {color:#fff; background: #424345;}

.morelink {  background:#d01317; color:#fff; border: none; font-weight: 300;  border-radius: 5px;   font-size:12px;  line-height:2em; padding: 0 10%; margin-top: 10%; display:inline-block; text-transform:uppercase;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
.morelink:hover {background: #424345; color: #fff; }

.italic {font-style:italic;}
hr {border: 0; color:#152863; height:1px; background:#152863; clear:both; margin:3% auto; max-width: 1280px;}
iframe {}
.breadcrumbs {margin-bottom:3%; font-size:0.825em;} 
.smalltext {font-size: 0.75em; margin-bottom: 0;}
.uppercase {text-transform: uppercase;}

.middle { top: 50%; transform: translateY(-50%); position:absolute;}
.middlealign {vertical-align: middle !important;}
.centered {text-align: center;}
.bottom {position: absolute; bottom: 5%; width: 100%;}
.rightalign {text-align: right;}

/*images*/
.attachment-medium {}
.alignright {float:right; margin-left:3%;  width: auto !important;}
.alignleft {float:left; margin-right:3%;  width: auto !important;}
#homelogo {position:absolute; z-index:450; width:33%; height:auto; left:3%; top:8%; }
.halfwidth img   {width: 100%; height: auto;}
.halfwidth .size-medium {width: auto !important; }
.size-large  {width: 100%; height: auto; margin-bottom:  3%}
.wp-block-image img {width: 100%}
figcaption {text-align: center; font-style: italic; width: 100%;     margin-top: .5em;  margin-bottom: 1em;}
.fbimage {position: fixed; z-index: -10; visibility: hidden; }

/*video*/
.js-video {height: 0; padding-top: 25px; padding-bottom: 51%; margin-bottom: 10px; position: relative; overflow: hidden; margin:0 0 3% 0;}
.js-video.widescreen {padding-bottom: 56.34%;}
.js-video.vimeo {padding-top: 0;}
.js-video embed, .js-video iframe, .js-video object, .js-video video {top: 0; left: 0; width: 100%; height: 100%; position: absolute;}

/*layout*/
.pagewidth {max-width:1500px; margin:0 auto; }
.withpadding { padding:3% 0;}
.blog {max-width:1024px; margin:0 auto; }
.contact {padding: 3% 15%;}
.topdiv {margin-top: 100px !important}
.verticalpadding {padding-top: 10% !important; padding-bottom: 20% !important; }
.nomargin {margin-bottom: 0;}

section {margin:0 3%; padding:6%; position: relative; }
section.content {padding: 3% 8%;}
section.related {padding: 0; margin: 0}
section.blogcontent {padding: 3% 15%;}
section.forms {padding: 3% 25%;}

.banner {height: 550px; width: 100%; background-size:cover; background-position: center top;position: relative;}
.shopbanner {height: 250px; width: 100%; background-size: 100% auto; background-position: center center; position: relative; background-attachment: fixed;}

.halfwidth {width:46%; padding: 2%; display:inline-block; vertical-align:top;  overflow: auto; }

.quarter {width:19.5%; margin-right:6%; display:inline-block; vertical-align:top; opacity: 1; transition:all 500ms ease; margin-bottom: 3%;}
.quarter:hover .blue {background: rgba(164,212,213, 0.7)}
.quarter:nth-of-type(4n) {margin-right: 0;}
.quarter img {width: 100%; height: auto; display: block;}
.threequarter {width: 75%; display: inline-block; vertical-align: middle;}
.quartered {width: 25%; display: inline-block; vertical-align: middle;}

.onethird {width:26%; padding: 0 3%; position: relative; display:inline-block; vertical-align:top; margin-right: 2%; background: rgba(109,40,133,0); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease; }
.onethird:nth-of-type(3n) {margin-right: 0;}
.onethird img {width: 100%; height: auto; display: block; margin-bottom: 6%; opacity: 1; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
.twothird {width:62%; margin-right: 4%;  display:inline-block; vertical-align:top;}

.twocolumns {-webkit-column-count: 2;  -moz-column-count: 2;  column-count: 2; -webkit-column-gap: 10px;  -moz-column-gap: 10px;  column-gap: 10px;}
.threecolumns {-webkit-column-count: 3;  -moz-column-count: 3;  column-count: 3; -webkit-column-gap: 10px;  -moz-column-gap: 10px;  column-gap: 10px; }

.fifth {width: 20%; display: inline-block; vertical-align: middle;}
.fifth img {width: 70%; height: auto;}

.sixth {width: 15%; margin: 0 0.75%; display: inline-block; vertical-align: middle;}

.eighth img {width: auto; height: auto; display: inline-block; vertical-align: middle; margin-bottom: 10px; max-height: 80px; max-width: 15%; padding:0 0.75% }

.partner img {width: auto; height: auto; display: inline-block; vertical-align: middle; margin-bottom: 10px; max-height: 50px; max-width: 15%; padding:0 0.75% }

/*flex*/
.flex {display: -webkit-flex; /* Safari */  display: flex; /* Standard syntax */ position: relative; z-index: 1000;}
.flex .halfwidth {-webkit-flex: 1; /* Safari */	-ms-flex: 1; /* IE 10 */	flex: 1; /* Standard syntax */}

/*colours*/
.whitetext p, .whitetext h1, .whitetext h2, .whitetext h3,  .whitetext label,  .whitetext .gfield_label, .whitetext li,.whitetext li a , .whitetext span, .whitetext strong, .whitetext td, .whitetext {color: #fff;}
.blacktext p, .blacktext h1, .blacktext h2, .blacktext h3,  .blacktext label,  .blacktext .gfield_label, .blacktext li, .blacktext span, .blacktext strong, .blacktext td, .blacktext {color: #121211;}



.redtext {color: #d01317; }
.boldfont {  font-family:"azo-sans-web", sans-serif; font-weight: 700; }

.darkgrey { background: #000000;}

/*googlemaps*/
.google_map { position: relative;  padding-bottom:30%; height: 0; overflow: hidden; margin-bottom:0; width: 100%; display: inline-block; vertical-align: top;}
.google_map iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

/*header & Mneus*/
header {height: 100px; top: 0; background:#d01317; z-index: 1499; position: fixed; width: 100%; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease; max-width: 100%; }

header.head {max-width: 100%;}

header img {height: 55px !important; width: auto !important; display: inline-block; position: absolute; top: 10px; left: max(20px, calc((100% - 1600px) / 2 + 20px)); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
header .menu-btn { display: none;}
.menu-icon {display: none;}


.main-menu {display:block; vertical-align: top; margin-left: 370px; max-width: 100%; }
.main-menu ul {list-style: none; margin-bottom: 0; padding-left: 0;}
.main-menu li {display: inline-block; vertical-align: top; padding:0 5px; text-align: center;}
.main-menu li a { line-height: 100px; text-decoration: none; font-size: 20px;   text-transform: uppercase; color: #fff; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease;}
.main-menu li a:hover {color: #000000 ;}



.woo-menu {display:block; position: fixed; right: 6%; top: 0; }
.woo-menu ul {list-style: none; margin-bottom: 0; padding-left: 0;}
.woo-menu li {display: inline-block; vertical-align: top; padding:0 5px; text-align: center;}
.woo-menu li a { line-height: 100px; text-decoration: none; font-size: 26px;   text-transform: uppercase; color: #fff; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease;}
.wooin-menu li a:hover {color: rgba(3,116,187,1) ;}

.wpmenucartli i, .wpmenucartli span {color: #fff; font-size: 20px;  }
li.wpmenucartli a.wpmenucart-contents span.amount {display: none !important;}
.woo-menu .dashicons {font-size: 20px !important;  vertical-align: middle !important; color: #fff;}
header .woo-menu  .myaccount {position: fixed; right: 285px; top: 0;  font-size: 0 !important; }
header .woo-menu  .myaccount a {font-size: 0 !important;}
.myaccount a:after { font-family: "Material Icons"; line-height: 100px; font-size: 27px !important; content: '\e7fd'; /* sets default icon to a circled "i" */
 color: #fff;}

 .cartcontents {
   padding-right: 10px;
 }

/*#searchbutton {display: none;}
.menu-item-271 {position: absolute; right: 3%; background: url(images/search.png) no-repeat; background-position: center center; width: 33px; font-size: 0; height: 100px; display: block; top: 0;} 
.menu-item-271 a {font-size: 0 !important;}
.searchwidth {max-width:1280px; margin:0 17%;}
.search-form {background:rgba(0,0,0,.7); position:fixed; z-index:9000; width:100%; top:100px; height:60px;}
.search-form.smaller {top: 60px;}
.innersearch {max-width:1280px; padding:1% 0; margin:0 2%;}
.search-field {width:87%; border:none; background:#fff; height:38px; color:#000; padding-left:2%; margin-right:2%; font-size:1em; display:inline-block;}
.search-submit {width:8%; border:none; background:url(images/search-home.png) no-repeat center #fff; height:38px; display:inline-block; position:relative; top:-2px;}
.menu li.current-menu-ancestor > .searchform {top:120px !important;}*/

.mobileonly {display: none !important;}


/* Hero Section */
.hero-section {
    position: relative;
    width: 100%;
    height: 700px;
    background: url("images/bike.jpg") center center / cover no-repeat;
    margin-top: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(204, 0, 0, 0.3) 100%);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 1200px;
    width: 100%;
    padding: 0 20px;
}

.hero-title {
    font-family: "azo-sans-web", sans-serif;
    font-size: 72px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 20px 0;
    letter-spacing: 2px;
    text-transform: uppercase;
    line-height: 1.2;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}

.hero-subtitle {
    font-family: "azo-sans-web", sans-serif;
    font-size: 24px;
    color: #fff;
    margin: 0 0 50px 0;
    font-weight: 300;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
}

.hero-search-container {
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
    padding: 0 20px;
}

.hero-search-wrapper {
    display: flex;
    gap: 12px;
    align-items: center;
    background: #fff;
    border-radius: 60px;
    padding: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
    width: 100%;
}

.hero-search-input {
    flex: 1;
    padding: 18px 28px;
    border: none;
    border-radius: 60px;
    font-size: 16px;
    font-family: "azo-sans-web", sans-serif;
    outline: none;
    transition: all 0.3s ease;
}

.hero-search-input:focus {
    outline: none;
}

.hero-search-btn {
    flex: 0 0 auto;
    padding: 18px 48px;
    background: #cc0000;
    color: #fff;
    border: none;
    border-radius: 60px;
    font-size: 18px;
    font-weight: 700;
    font-family: "azo-sans-web", sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    white-space: nowrap;
}

.hero-search-btn:hover {
    background: #a00000;
    box-shadow: 0 4px 12px rgba(204, 0, 0, 0.4);
}

.hero-search-btn:active {
    transform: scale(0.98);
}

/* Legacy styles kept for compatibility */
.homebike {background: url("images/bike.jpg"); background-size:55%; background-attachment: fixed; background-position: right 99px;}
.homesearch {padding: 2%; margin-left: 45%;}
.hometitle {word-spacing: 1000px; margin-top: 10%; font-size: 75px;}

.home .darkgrey {padding-top: 10%; margin-top: -7%}


/*search*/
.errorMsg{ color: #cc0000; margin: 10px; display:none;}
.search-field {padding: 10px;  border: 1px solid #efefef;}
.search-submit {background: rgb(208,19,23);  border: none;  padding: 10px;  color: #fff;}

.search-result {width: 96%; display: inline-block; padding: 2%; margin-bottom: 2%; border-bottom: 1px solid  #121211; }
.search-result:nth-of-type(4n) {margin-right: 0;}
.search-result img {width: 100%; height: auto;}

.searchtitle {font-family:"azo-sans-web", sans-serif; font-weight: 700;}
.searchtitle a {text-decoration: none; font-family:"azo-sans-web", sans-serif; font-weight: 700;}

#map {width: 100%; height: 50%;}
.page-template-page-presalepostcode #map {width: 48%; height: 500px; display: inline-block;}
#maphome {width: 100%; height: 60%;}

/*search*/
.searchresults a {color: #d01317; font-weight: 700; text-decoration: none;  }
.searchresult {display: inline-block;  vertical-align: top} 
.searchresult img {width: 100%; height: auto;}

/*galery*/
.gallery {margin-bottom:0 !important;}
.gallery-item, .gallery-item img {border:none !important; }
.gallery-item {width:12% !important; height:auto; margin:0 2% !important; margin-bottom:1% !important; margin-top:0 !important; display:inline-block !important; float:none !important;}
.gallery-item img {width:100%; height:auto; display:block;}
.gallery-item a {display:block;}
#cboxOverlay { background: rgba(0,0,0,0.6) !important; opacity:1}
#cboxTopLeft, #cboxTopCenter, #cboxTopRight, #cboxMiddleLeft, #cboxMiddleRight, #cboxBottomLeft, #cboxBottomCenter, #cboxBottomRight { background: none !important;}
#cboxLoadedContent {margin-bottom:40px !important;}
#cboxPrevious, #cboxNext {bottom:8px !important ;}
#cboxPrevious {left:5px !important ;}
#cboxNext {left:32px !important ;} 
#cboxClose { background: url(images/close.png) no-repeat !important; top:1% !important; height: 53px !important;  position: absolute; right: 1% !important ;  text-indent: -9999px; width: 53px !important;}
#cboxPrevious {background:url(images/prev.png) no-repeat !important; top: 50%;  transform: translateY(-50%); height: 35px !important;  left: 0 !important;  position: absolute;    text-indent: -9999px;    width: 25px;}
#cboxNext { background:url(images/next.png)!important;    top: 50%;  transform: translateY(-50%); left:auto !important;   height: 35px !important;    right:0 !important;    position: absolute;    text-indent: -9999px;    width: 25px;}
#cboxCurrent {bottom: 10px !important; color: #646464 !important; left: 2% !important;}
#cboxTitle, #tooltip {display:none !important; }

/*WOOO*/
.pagewidthproduct {max-width:1024px; margin:0 auto;}
.postid-7039 .pagewidthproduct {padding-top: 90px;}
.pagewidthproduct section {margin: 0 3%; padding: 3%; position: relative}
section.woocommerce-order-details, section.woocommerce-customer-details, section.woocommerce-columns {padding: 0; margin-left: 0; margin-right:0 }

.archive .product {border: 1px solid #000; padding: 2%; position: relative;  margin-bottom: 3% !important; min-height: 120px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease;}
.archive .product:hover {background: rgba(208,19,23,1);}
.archive .product a {display: block;}
.archive .product p {font-family:"azo-sans-web", sans-serif; font-size: 18px; margin-bottom: 2%; }
.archive .product:hover p {color: #fff}
.archive .product img {float: right; height: 120px !important; width: auto; }

.related .product {border: 1px solid #fff; padding: 2%; position: relative;  margin-bottom: 3% !important; min-height: 120px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease;}
.related .product:hover {background: rgba(208,19,23,1);}
.related .product a {display: block;}
.related .product p {font-family:"azo-sans-web", sans-serif; font-size: 18px; margin-bottom: 2%; }
.related .product:hover p {color: #fff}
.related .product img {float: right; height: 120px !important; width: auto; }

.searchbox {padding: 2%; border: 1px solid #000; margin-bottom: 6%;}

.woocommerce-MyAccount-content header {position: relative !important; height: auto !important; background: none !important;}

#gform_wrapper_3 {padding: 6%; border: 1px solid #121211; border-radius: 30px; margin: 30px 0; background-color: rgba(66,67,69,0.05)}
#gform_wrapper_3 .gfrom_footer {display: none;}
#gform_wrapper_3 .gform_description {font-size: 18px; font-family:"azo-sans-web", sans-serif; font-weight: 700; display: block; margin-bottom: 30px;}
.single_variation_wrap .single_variation  {background: #d01317;padding: 6%;}
.single_variation_wrap .single_variation bdi, .single_variation_wrap .single_variation span, .single_variation_wrap .single_variation p {color: #fff;  font-family:"azo-sans-web", sans-serif; font-weight: 700; }
p.stock {margin-bottom: 0; color:#8CBD0A !important}

/****************CHECKOUT***************/
#shipping-option {display: none !important;}
.woocommerce-order-details header{  position: relative;  background:none;  height: auto;  margin-bottom: 3%;}


.woocommerce-checkout #payment div.payment_box input.input-text, .woocommerce-checkout #payment div.payment_box textarea {
    width: 100% !important;    padding: 8px;}
.woocommerce #payment .form-row select, .woocommerce-page #payment .form-row select {    width: 100%;    height: 30px;}
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {    padding: .6180469716em;    background-color: #fff;    color: #000;    outline: 0;   -webkit-appearance: none;    border-radius: 2px;    box-sizing: border-box;    font-weight: 400;   border:solid 2px #e4e4e4; font-size: 1.1em;}
/*.woocommerce div.product form.cart div.quantity, .woocommerce div.product form.cart .button {float: right !important; margin-bottom:0 !important; }*/
.woocommerce-checkout-review-order-table, .woocommerce table.shop_table { border: 1px solid rgba(0,0,0,.7) }
.woocommerce table.shop_table td, .woocommerce table.shop_table tfoot th {border-top:1px solid rgba(0,0,0,.7) ;}


.woocommerce-checkout-payment label, .woocommerce-checkout-payment p, .woocommerce-checkout-payment span {color: #000 !important; }
.woocommerce-order-details, .woocommerce-customer-details {margin: 0;}
.woocommerce .actions button { background: #d01317  !important;  color:  #fff !important; }
.woocommerce .actions button:hover { color: #d01317  !important; background: #fff!important; }
.payment_box .woocommerce-checkout #payment div.form-row {padding: 0 !important;}


.mailchimp-newsletter {margin-top: 6% !important; }
.mailchimp-newsletter:before {content: '\E0E1' !important; color: #d01317; display: inline-block !important; vertical-align: middle; font-size: 35px;  font-family: "Material Icons"; width: 40px; }

.wc-block-components-shipping-rates-control__package {display: none;}

/*.wc-block-checkout__terms--with-separator:before {content: 'Proof of Address'; font-size: 1.25em; font-family: "Helvetica Neue LT W05_75 Bold"; display: block;
padding-bottom: 2%;}
#fme_upload_files_preview_cart_file:before {content: 'Please upload proof of your address. This can include - utility bill, council tax, government letter or letter from an education establishment '; display: block; padding-bottom: 2%;}
#fme_upload_files_preview_cart_file, #fme_upload_files_preview_cart_file li, .Outer_upload ul, .fme-uploader-default ul {padding-left: 0 !important;}
.wc-block-components-button__text {color: #fff !important}*/

.woocommerce-checkout .wc-block-components-error {display: none !important}


footer ul {padding-left: 0;}
footer .foot-menu li {    list-style: none;    padding-left: 30px !important;    background: url("images/list.png") no-repeat left center !important;
    background-size: auto 70% !important;    font-size: 16px !important;    line-height: 31px !important;}
.foot-menu li a:hover,.policy-menu li a:hover {color: #d01317;}
.foot-menu li a,.policy-menu li a {text-decoration: none;}

footer .policy-menu li {
    list-style: none;  font-size: 16px !important; background: none; line-height:20px; padding-left: 0 ;}


/* Rounded corners on the WooCommerce "alert" messages */
.woocommerce-error, .woocommerce-info, .woocommerce-message { border-radius: 3px; }

/* some tweaks to simplify the payment method area */
.woocommerce-checkout #payment { background: none!important; }
.woocommerce-checkout #payment ul.payment_methods { border: none; }

/*end of checkout */

.woocommerce-customer-details, .woocommerce-checkout .woocommerce-customer-details address { margin: 0 !important; padding: 0 !important; overflow: hidden;}
.wc-block-components-button {background: #d01317 !important; border: none}
.wc-block-components-button div {color: #fff !important}
.content .tgwc-woocommerce-MyAccount-navigation-wrap li,  .woocommerce-MyAccount-navigation-link {padding-left: 0 !important;}


.woocommerce .button  {background: #d01317 !important;  color: #fff !important;   border-radius: 5px; border: none; font-size:1em; line-height:2em; display:inline-block; margin-top:3%; text-transform:uppercase; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease; }
.woocommerce .button:hover {color:#fff !important; background:#424345 !important; }
li.pewc-group {margin: 3% 0}
.pewc-group-wrap {margin-bottom: 3%;}
.pewc-field-label {display: block; margin-bottom: 3%;}
.pewc-form-field {width: 100%;}
.ui-datepicker-calendar {width: 100% !important;}
.pewc-form-field {padding: .6180469716em;    background-color: #fff;    color: #000;    outline: 0;   -webkit-appearance: none;    border-radius: 2px;    box-sizing: border-box;    font-weight: 400;   border:solid 2px #e4e4e4; font-size: 1.1em;}
.woocommerce-cart table.cart td.actions .coupon .input-text  {padding: 11px 4px !important; margin-right: 12px !important; }
.woocommerce table.shop_table td, .woocommerce table.shop_table th {padding: 15px !important;}
.shop_table thead th {border-bottom:  1px solid #fff !important;}

.woocommerce .quantity, .woocommerce-variation-add-to-cart button, .woocommerce .single_add_to_cart_button {margin-top: 3% !important;}
.woocommerce .single_add_to_cart_button {padding: 0.818em 1em !important;}
.woocommerce .quantity .qty {padding: 10px 8px !important; margin-right: 12px !important; font-size: 14px;}
.woocommerce .quantity:before {content: 'How Many Spaces?' !important; font-weight: bold; width: 160px !important; display: inline-block;  }
.woocommerce .sold-individually .quantity:before {content: '' !important;}
.woocommerce-variation-add-to-cart .price:before {content: 'Cost'; font-weight: bold; width: 160px !important; display: inline-block;  }
.woocommerce div.product form.cart .group_table td {vertical-align: middle !important;}
.woocommerce #customer_details {margin-bottom: 3%;}

.variations .label {width: 160px !important;}
.variations .label label {top: 11px; position: relative;} 
.variations .value {position: relative;}
.variations .value:after {content: ''; background-image: url(images/down.jpg); background-repeat: no-repeat; background-position: center center; width: 51px;  right: 18px;    top: 5px;    height: 50px;   position: absolute;    pointer-events: none; cursor: pointer;}
.woocommerce div.product form.cart .variations select {-webkit-appearance: none;  -moz-appearance: none;  appearance: none;  /* Add some styling */ 
  display: block;
  width: 100%;
  max-width: 320px;
  height: 50px;
  float: right;
  margin: 5px 0px;
  padding: 0px 24px;
  font-size: 16px;
  line-height: 1.75;
  color: #333;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #010b13;
  -ms-word-break: normal;
  word-break: normal;}
  
.woocommerce div.product form.cart div.quantity, .woocommerce div.product form.cart .button {float: right;}
.woocommerce div.product form.cart .button {float: right !important;}
.product_meta {display: none;}
.woocommerce-page div.product div.summary {float: none !important; width: 100% !important;}
section.related {
    padding: 0 !important;
    margin: 0 !important;
}
.wc-pao-addons-container {
border: 1px solid gray;
padding: 2%;
margin-top: 3%;
}

/**
 * My Account
 */

.woocommerce-account .woocommerce-MyAccount-navigation, .membersnav {	width: 25% !important;}
/*.woocommerce-account .woocommerce-MyAccount-content {  display: inline-block;  float: left;  margin-left: 5%;  width: 75%;}*/
.woocommerce-account .woocommerce-MyAccount-navigation ul {    padding: 0;	border-top: 1px solid #eee;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {	list-style: none;	border-bottom: 1px solid #eee;	padding-bottom: 0;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a:before {	opacity: 1;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {	padding: 10px 5px;	display: block;	color: #424345;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:before {	margin-right: 20px;    opacity: .25;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover:before {	opacity: 1;}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--dashboard a:before {
 font-family: "Material Icons";
	content: "\e871";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--orders a:before {
 font-family: "Material Icons";
	content: "\f291";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--downloads a:before {
 font-family: "Material Icons";
	content: "\f1cc";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--edit-address a:before {
font-family: "Material Icons";
	content: "\f015";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--payment-methods a:before {
font-family: "Material Icons";
	content: "\e88a";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--edit-account a:before {
 font-family: "Material Icons";
	content: "\e7fd";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a:before {
 font-family: "Material Icons";
	content: "\e9ba";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--subscriptions a:before {
 font-family: "Material Icons";
	content: "\e8f7";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--members-area a:before {
 font-family: "Material Icons";
	content: "\e064";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--bookings a:before {
 font-family: "Material Icons";
	content: "\ebcc";
}.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--woocommerce-waitlist a:before {
 font-family: "Material Icons";
	content: "\e88b";
}.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--orders a:before {
 font-family: "Material Icons";
	content: "\e0ee";
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--vouchers {display: none;}
.woocommerce-account .woocommerce-MyAccount-content h2 {	font-size: 25px;    text-align: center;	font-weight: 600;}
.woocommerce-account p.order-again {    text-align: right;}
.woocommerce-account .woocommerce-EditAccountForm input[type="submit"] {    margin-top: 50px;    float: right;}


#gform_wrapper_1 {max-width: 75%; text-align: center; margin: auto;}
#gform_wrapper_1 li {width:33%; display: inline-block; padding: 0 1% !important; }
#gform_wrapper_1 .gform_body {width:80%; display: inline-block;  }
#gform_wrapper_1 .gform_footer {width:19%; display: inline-block; vertical-align: top; }
#gform_wrapper_1 .gform_footer input.button {width:100%;   }
#gform_wrapper_1 input {padding:4%;}

@media only screen and (min-width:0px) and (max-width:1200px) {
header {height: 100px;z-index: 10499; padding-top: 0; text-align: center; position: fixed; top: 0px; width: 100%; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease;  transition: all 0.5s ease; }
header.smaller {height: 100px;}
header .whitehead {background: none; height: 95px; border-bottom:5px solid #7c858b; }
header.smaller .main-menu {    margin-top: 0px;}
header img {    height: 50px !important;    width: auto !important;        top: 20px;    left: 3%;}

.main-menu {   clear: both; background: #424345;  height:0; opacity: 0; transform: none; margin-left: 0; position: fixed; z-index: 10000; top:100px; left: 0; width: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
.main-menu ul {margin:0 auto !important; left:0; right: 0; padding:0; height: 0; display:block;  top: 60px; width: 100%;  transform: none; position:absolute; max-width: 100%; text-align: center; border-top: none !important}
header .main-menu li { padding:0 !important; text-align:left;  height:50px !important;  display: none;   -webkit-transition: background-position 0.5s;    -moz-transition: background-position 0.5s;    transition: background-position 0.5s;}
header .main-menu li a {text-decoration:none; line-height:50px; color: #fff !important; padding: 0; font-size: 24px; font-weight: 700; display:none;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease;  transition: all 0.3s ease;}
.main-menu li:hover { color:#fad775;  background-position: -100% 0;}
.main-menu li:hover a {color:#fad775 !important; }
.main-menu li a:active {color:#fad775 !important;}
.menu-item-443 {display: block;}

header .menu-icon {  cursor: pointer;  display: inline-block;  float: right;  padding:50px 0px 0px ;  position: fixed;  right: 15px;  z-index: 10010;  user-select: none; top: 0; }
header .menu-icon .navicon {  background:#fff; display: block;  height: 3px;  position: relative;  transition: background .2s ease-out;  width: 28px;}
header .menu-icon .navicon:before,header .menu-icon .navicon:after {  background:#fff;  content: '';  display: block;  height: 100%;  position: absolute;  transition: all .2s ease-out;  width: 100%;}
header .menu-icon .navicon:before {  top: 8px;}
header .menu-icon .navicon:after {  top: -8px;}
header .menu-btn:checked ~ .main-menu ul li.logomenu {display: none !important;}




header .mobilelogo {display: inline-block; position: fixed; height: 60px; width: 145px; left: 0; right: 0; margin: auto; top: 20px;} 
header .mobilelogo img {height: 60px; width: auto; }

.menu-btn:checked ~ .main-menu {  bottom: 0; height: 100% !important; width: 100%; opacity: 1;}
.menu-btn:checked ~ .main-menu ul {  position: absolute; height: 100%; top: 80px !important; }
.menu-btn:checked ~ .main-menu ul li {  display:block !important; opacity: 1; width: 100%; text-align: center; padding: 0;}
.menu-btn:checked ~ .main-menu ul li a{  display:block !important; opacity: 1; }
.menu-btn:checked ~ .main-menu ul .menu-item-243 {display: none !important;  opacity: 1;}
.menu-btn:checked ~ .menu-icon .navicon {  background: transparent; }
.menu-btn:checked ~ .menu-icon .navicon:before {  transform: rotate(-45deg); background: #fff}
.menu-btn:checked ~ .menu-icon .navicon:after {  transform: rotate(45deg); background: #fff;}
.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {  top: 0;}

.woo-menu {  right: 10% !important;  top: 0;
}

header.smaller .main-menu li a {line-height: 60px;}
.menu-item-271 {
    position: fixed;
    right: 60px;
    background: url(images/search.png) no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
    background-position: center center;
    width: 33px !important;
    font-size: 0;
    height: 100px;
    display: block;
    top: 22px;
}

/*.searchwidth {max-width:1280px; margin:0 5%;}
.search-form {background:rgba(0,0,0,.7); position:fixed; z-index:19000; width:100%; top:100px; bottom: 0; height: auto;}
.innersearch {max-width:1280px; padding:1% 0; margin:0 2%;}
.search-field {width:87%; border:none; background:#fff; height:38px; color:#000; padding-left:2%; margin-right:2%; font-size:1em; display:inline-block;}
.search-submit {width:8%; border:none; background:url(images/search-home.png) no-repeat center #fff; height:38px; display:inline-block; position:relative; top:-2px;}*/

/*flex*/
.flex {display: block; /* Safari */  display: black; /* Standard syntax */ position: relative; z-index: 1000;}
.flex .halfwidth {-webkit-flex: none; /* Safari */	-ms-flex: none; /* IE 10 */	flex: none; /* Standard syntax */}

.topdiv {padding-top: 0px; margin-top: 100px;}
.banner-video {    width: 100%;    height: 400px;    position: relative;    overflow: hidden;}
.banner-video video {    width: auto !important;    height: 100% !important;   }

.pageimage {width: 100%; height: auto;}

.halfwidth {width:92% !important; margin-right:0; padding: 4% !important;}
.fullhalf {width: 100%;}
.quarter {width:96%; }
.onethird {width:100%; margin-right: 0;  }
.onethirdfull {width:100%;  }
.twothird {width:100%; margin-right: 0; }
.fifth {width: 48%; margin-bottom: 3%}
.sixth {width: 47.5%;  margin-right: 2%; margin-bottom: 3%}
.sixth:nth-of-type(2n) {margin-right: 0;}

.page-template-page-presalepostcode #map {width: 100%; height: 500px; display: inline-block;}

.threequarter {width: 100%}
.quartered {width: 100%;}
.centered img {max-width: 100%;}

.search-field {    width: 84%;}
.search-submit {   margin-top: 2%}
/* Hero Section - Mobile */
.hero-section {
    height: 500px;
}

.hero-title {
    font-size: 36px;
    margin-bottom: 15px;
}

.hero-subtitle {
    font-size: 16px;
    margin-bottom: 30px;
}

.hero-search-wrapper {
    flex-direction: column;
    padding: 12px;
    max-width: 90%;
}

.hero-search-input {
    width: 100%;
    padding: 16px 24px;
    font-size: 16px;
}

.hero-search-btn {
    width: 100%;
    padding: 16px 32px;
}

/* Legacy styles */
.hometitle {    font-size: 54px;}
.homesearch {    margin-left: 0;}
.homebike {background: url("images/bike.jpg"); background-size:auto 100%; background-attachment: fixed; height: 400px;}

/*footer*/
footer {background: rgb(255,255,255); background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(192,223,200,1) 30%); color: #fff;}
footer .bottom { position: relative; z-index: 1; overflow-x: hidden !important;}
footer .bottomback {background: url("images/footer-hills-02.png") no-repeat top center; background-size: 100% auto; position: relative; z-index: 3}
footer .fifth img {width: 70%; padding: 0 15% 3% 15%}
footer h3 {color: #37b6ae; font-size: 18px;}
footer .fifth { color: #fff; vertical-align: top;}
footer .fifth a {color: #fff;}
.footerlogo {max-width: 252px; height: auto;}
.footer-menu ul {padding-left: 0;}
.footer-menu li {list-style: none;}
.footer-menu li a {color: #fff;}
.montyfooter {position: relative; left: 60%; height: 200px; margin-top: 5%; display: block; z-index: 10; leftt: -600px; -webkit-user-select:none; -moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;
-webkit-animation-name:montymove;
-webkit-animation-duration:29s;
-webkit-animation-timing-function:linear;
-webkit-animation-iteration-count:infinite,infinite;
-webkit-animation-play-state:running;
-webkit-animation-delay: 0s;
animation-name:montymove;
animation-duration:29s;
animation-delay: 0s;
animation-timing-function:linear;
animation-iteration-count:infinite,infinite;
animation-play-state:running
}

.mobilefooter {background: #297284; }

#gform_wrapper_1 {max-width: 100%; text-align: center; margin: auto;}
#gform_wrapper_1 li {width:100%; display: inline-block; padding: 0 1% !important; }
#gform_wrapper_1 .gform_body {width:100%; display: inline-block;  }
#gform_wrapper_1 .gform_footer {width:100%; display: inline-block;  }
#gform_wrapper_1 .gform_footer input.button {width:100%;   }
#gform_wrapper_1 input {padding:4%;}
.gform_legacy_markup_wrapper li.hidden_label input {
    margin-top: 0px;
}

}


/* ===========================
   HEADER REFACTOR - Modern Flexbox Layout
   DESKTOP ONLY (min-width: 1201px)
   =========================== */

@media (min-width: 1201px) {
    /* Override old header styles with modern flexbox */
    header.head {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        max-width: 100% !important;
        padding: 0 30px !important;
        gap: 20px !important;
    }

    /* Logo on the left */
    header.head .logolink {
        flex: 0 0 auto !important;
        order: 1 !important;
        margin: 0 !important;
    }

    header.head .logolink img {
        max-height: 80px;
        width: auto;
    }

    /* Main menu in the center */
    header.head .main-menu {
        flex: 1 1 auto !important;
        order: 2 !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        background: transparent !important;
        position: static !important;
        height: auto !important;
        opacity: 1 !important;
        transform: none !important;
        clear: none !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        z-index: auto !important;
    }

    header.head .main-menu ul {
        display: flex !important;
        gap: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        height: auto !important;
        transform: none !important;
        border: none !important;
        top: auto !important;
        width: auto !important;
        max-width: none !important;
        text-align: left !important;
    }

    header.head .main-menu li {
        display: inline-block !important;
        padding: 0 !important;
        height: auto !important;
        text-align: center !important;
        background: none !important;
    }

    header.head .main-menu li a {
        display: inline-block !important;
        line-height: 100px !important;
        color: #fff !important;
        font-size: 20px !important;
        text-transform: uppercase !important;
    }

    header.head .main-menu li a:hover {
        color: #000 !important;
    }

    /* Woo menu (cart/account) on the right */
    header.head .woo-menu {
        flex: 0 0 auto !important;
        order: 3 !important;
    }

    header.head .woo-menu ul {
        display: flex !important;
        gap: 20px !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Hide mobile menu toggle on desktop */
    header.head .menu-btn,
    header.head .menu-icon {
        display: none !important;
    }
}

/* Remove white background on mobile hero search */
@media (max-width: 1200px) {
    .hero-search-wrapper {
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        gap: 8px !important;
    }
    
    .hero-search-input {
        background: #fff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    }
    
    .hero-search-btn {
        padding: 18px 32px;
    }
}
