1<!DOCTYPE html> 2<html lang="en"> 3 4<head> 5 <meta charset="UTF-8" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 7 <meta name="robots" content="index,follow" /> 8 <link rel="icon" href="/core/view/website_2/src/images/camper-and-nicholsons-favicon-2.png" type="image/png"> 9 <link rel="stylesheet" href="/core/view/website_2/src/css/output.css?v=56" /> 10 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/locomotive-scroll@beta/bundled/locomotive-scroll.css"> 11 <link href="https://cdn.jsdelivr.net/npm/@splidejs/[email protected]/dist/css/splide.min.css" rel="stylesheet"> 12 <link href="https://api.mapbox.com/mapbox-gl-js/v3.11.0/mapbox-gl.css" rel="stylesheet"> 13
13<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="https://api.mapbox.com/mapbox-gl-js/v3.11.0/mapbox-gl.js"></script>
13 14 <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/tippy.css" /> 15 16 <!-- Facebook --> 17 <meta property="og:site_name" content="Camper & Nicholsons International" /> 18 <meta property="og:title" content="Camper & Nicholsons Login | C&N" /> 19 <meta property="og:description" content="..." /> 20 <meta property="og:url" content="https://camperandnicholsons.com/login" /> 21 <meta property="og:image" content="https://camperandnicholsons.com/core/composer/view.php?id_img=&size=l" /> 22 <meta property="og:type" content="" /> 23 <meta name="facebook-domain-verification" content="2wnwb1c1xemasix7f2y7zf5i3079dl" /> 24 <!-- Twitter --> 25 <meta name="twitter:card" content="summary"> 26 <meta name="twitter:title" content="Camper & Nicholsons Login | C&N"> 27 <meta name="twitter:description" content="..."> 28 <meta name="twitter:site" content="https://camperandnicholsons.com/login"> 29 <meta name="twitter:image" content="https://camperandnicholsons.com/core/composer/view.php?id_img=&size=l"> 30 <!-- Canonical --> 31 <link rel="canonical" href="https://camperandnicholsons.com/login"> 32 33 <title>Camper & Nicholsons Login | C&N</title> 34 <meta name="description" content="..."> 35 36 <!-- Google Tag Manager --> 37
37<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq">
vendor: 343 bytes, lines 37-41
37(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': 38 new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], 39 j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 40 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); 41 })(window,document,'script','dataLayer','
41GTM-T6KHB65
vendor: 3 bytes, line 41
41');
41</script>
41 42 <!-- End Google Tag Manager --> 43 44</head>
45<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"> 46 // Define dataLayer and the gtag function. 47 window.dataLayer = window.dataLayer || []; 48 function gtag(){dataLayer.push(arguments);} 49 50 // Set default consent to 'denied' as a placeholder 51 // Determine actual values based on your own requirements 52 gtag('consent', 'default', { 53 'ad_storage': 'denied', 54 'ad_user_data': 'denied', 55 'ad_personalization': 'denied', 56 'analytics_storage': 'granted', 57 'functionality_storage': 'granted' 58 }); 59 60 document.addEventListener("DOMContentLoaded", function() { 61 const consent = JSON.parse(localStorage.getItem("consent") || "[]"); 62 63 // If we have consent saved, load it and set any saved properties 64 console.log(consent); 65 if (consent.length) { 66 consent.forEach((c) => { 67 if(c.value == 'statistical_cookies' && c.checked){ 68 69 } else if(c.value == 'advertising_cookies' && c.checked){ 70 //Linkedin 71 window._linkedin_partner_id = "1217340"; 72 window._linkedin_data_partner_ids = window._linkedin_data_partner_ids || []; 73 window._linkedin_data_partner_ids.push(window._linkedin_partner_id); 74 75 var script = document.createElement("script"); 76 script.setAttribute("nonce", "KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"); // se usi CSP 77 script.type = "text/javascript"; 78 script.async = true; 79 script.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js"; 80 document.head.appendChild(script); 81 82 var noscript = document.createElement("noscript"); 83 noscript.innerHTML = '<img height="1" width="1" style="display:none;" alt="linkedin" src="https://dc.ads.linkedin.com/collect/?pid=1217340&fmt=gif" />'; 84 document.body.appendChild(noscript); 85 86 //Facebook 87 !function(f,b,e,v,n,t,s){ 88 if(f.fbq)return; 89 n=f.fbq=function(){ 90 n.callMethod ? 91 n.callMethod.apply(n,arguments) : n.queue.push(arguments) 92 }; 93 if(!f._fbq) f._fbq=n; 94 n.push=n; 95 n.loaded=!0; 96 n.version='2.0'; 97 n.queue=[]; 98 t=b.createElement(e); 99 t.setAttribute("nonce", "KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"); 100 t.async=!0; 101 t.src=v; 102 s=b.getElementsByTagName(e)[0]; 103 s.parentNode.insertBefore(t,s); 104 }(window,document,'script','https://connect.facebook.net/en_US/fbevents.js'); 105 106 fbq('init', '688013071644149'); 107 fbq('track', 'PageView'); 108 109 if (typeof gtag === "function") { 110 gtag('consent', 'update', { 111 'ad_storage': 'granted', 112 'ad_user_data': 'granted', 113 'ad_personalization': 'granted' 114 }); 115 } 116 117 var noscript = document.createElement("noscript"); 118 noscript.innerHTML = '<img height="1" width="1" style="display:none;" src="https://www.facebook.com/tr?id=688013071644149&ev=PageView&noscript=1"/>'; 119 document.body.appendChild(noscript); 120 } 121 }); 122 } 123 }); 124</script>
124 125 126<!--Pardot-->
127<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" type="text/javascript"> 128piAId = '75772'; 129piCId = '1038'; 130piHostname = 'pi.pardot.com'; 131 132(function() { 133 function async_load(){ 134 var s = document.createElement('script'); s.type = 'text/javascript'; 135 s.src = ('https:' == document.location.protocol ? 'https://pi' : 'http://cdn') + '.pardot.com/pd.js'; 136 var c = document.getElementsByTagName('script')[0]; c.parentNode.insertBefore(s, c); 137 } 138 if(window.attachEvent) { window.attachEvent('onload', async_load); } 139 else { window.addEventListener('load', async_load, false); } 140})(); 141</script>
141 142 143
143<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"> 144 // window.intercomSettings = { 145 // app_id: "i8brigq4" 146 // }; 147 </script>
147 148 149
149<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"> 150 // setTimeout(function(){ 151 // (function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/o3q4nyuy';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(document.readyState==='complete'){l();}else if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})(); 152 // }, 3000); 153 154 </script>
154 155 156 <style> 157 .grecaptcha-badge{display:none!important} 158</style> 159<div class="console hidden"></div> 160<!-- <body class="font-sans font-normal antialiased transition-colors duration-700 bg-black overflow-x-hidden theme-dark"> --> 161<body x-data="magneticCursor" class="font-sans font-normal antialiased transition-colors duration-700 bg-black overflow-x-hidden theme-dark"> 162 <!-- Google Tag Manager (noscript) -->
vendor: 72 bytes, lines 162-163
162 163 <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
163GTM-T6KHB65
vendor: 91 bytes, lines 163-165
163" 164 height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> 165
165<!-- End Google Tag Manager (noscript) --> 166 <div 167 x-data="consent({ 168 gtm: { key: 'GTM-XXXX' }, 169 })" 170 x-show="show" 171 style="display: none" 172 x-on:keydown.escape.prevent.stop="show = false" 173 role="dialog" 174 aria-modal="true" 175 x-id="['modal-title']" 176 :aria-labelledby="$id('modal-title')" 177 class="fixed inset-0 z-[100] overflow-y-auto" 178 data-lenis-prevent> 179 <div 180 x-show="show" x-transition 181 x-on:click="show = false" 182 class="relative flex min-h-screen items-center justify-end r:justify-center p-[10px] s:p-[20px]"> 183 <div 184 x-on:click.stop 185 x-trap.noscroll.inert="show" 186 class="relative w-full r:max-w-[460px] rounded-[2px] bg-white p-[20px] s:p-[40px]"> 187 <button @click="rejectAll()" class="absolute top-0 right-0 w-[40px] h-[40px] flex items-center justify-center"> 188 <svg width="20" height="20" fill="none" xmlns="http://www.w3.org/2000/svg"> 189 <path d="M16 4 4 16M16 16 4 4" stroke="currentColor" stroke-miterlimit="10" /> 190 </svg> 191 </button> 192 193 <div x-show="!showSettings"> 194 <h2 :id="$id('modal-title')" class="body-14 font-medium all-caps mb-[20px]">Cookies on C&N</h2> 195 196 <p class="body-12 leading-[1.3] tracking-[-0.01em] [&_a]:underline [&_a:hover]:no-underline mb-[30px]"> 197 C&N uses cookies and other online tracking technologies for analytics, advertising, and otherwise enhancing your experience. You can manage your preferences by clicking on âSettings.â By continuing to navigate in our website, you consent to these technologies and our Terms and Conditions of Use. To learn more, see our <a href="#">Legal Statement</a> and <a href="/privacy-policy">Privacy Policy</a>. 198 </p> 199 200 <div class="flex flex-col s:flex-row gap-[10px]"> 201 <button 202 @click="showSettings = true" 203 class="s:flex-1 btn bg-light-grey/50 text-black !justify-center rounded-[2px] tracking-[0.06em]"> 204 Settings 205 </button> 206 207 <button 208 @click="acceptAll()" 209 class="s:flex-1 btn bg-black text-white !justify-center rounded-[2px] tracking-[0.06em]"> 210 Accept All 211 </button> 212 </div> 213 </div> 214 215 <div x-show="showSettings"> 216 <h2 class="body-14 font-medium all-caps mb-[30px]">Manage Consent Preferences</h2> 217 218 <ul class="mb-[30px]"> 219 <template x-for="property in properties"> 220 <li x-data="{ expanded: false }" class="border-b border-black/10"> 221 <div 222 class="flex flex-row items-center gap-x-[20px] h-[56px] cursor-pointer" 223 @click="expanded = !expanded" 224 :aria-expanded="expanded.toString()"> 225 226 <svg x-show="!expanded" class="shrink-0" width="15" height="15" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 227 <path d="M7.5 3.5v9M12 8H3" stroke="#000" stroke-miterlimit="10" /> 228 </svg> 229 230 <svg x-show="expanded" class="shrink-0" width="15" height="15" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 231 <path d="M12 8H3" stroke="#000" stroke-miterlimit="10" /> 232 </svg> 233 234 <span x-text="property.name" class="flex-1 body-12 font-medium all-caps"></span> 235 236 <template x-if="property.checked && property.readOnly"> 237 <span class="shrink-0 body-12 font-medium">Always Active</span> 238 </template> 239 240 <template x-if="!(property.checked && property.readOnly)"> 241 <label 242 class="shrink-0 w-[58px] h-[24px] rounded-[40px] border border-black/10 relative cursor-pointer transition-all" 243 :class="{ 244 'bg-black/10': property.checked, 245 }"> 246 <input 247 type="checkbox" 248 :id="`cookies-${property.value}`" 249 :name="property.value" 250 x-model="property.checked" 251 :checked="property.checked" 252 :disabled="property.readOnly ? true : false" 253 class="hidden peer"> 254
255 <span class="absolute top-[1px] left-0 translate-x-px peer-checked:translate-x-[35px] w-[20px] h-[20px] rounded-full bg-black transition-transform"></span> 256 </label> 257 </template> 258 </div> 259 260 <div x-show="expanded" x-collapse> 261 <p x-text="property.description" class="body-12 pb-[20px]"></p> 262 </div> 263 </li> 264 </template> 265 </ul> 266 267 <div class="flex flex-col s:flex-row gap-[10px]"> 268 <button 269 @click="rejectAll()" 270 class="s:flex-1 btn bg-light-grey/50 text-black !justify-center rounded-[2px] tracking-[0.06em]"> 271 Refuse All 272 </button> 273 274 <button 275 @click="accept()" 276 class="s:flex-1 btn bg-black text-white !justify-center rounded-[2px] tracking-[0.06em]"> 277 Save 278 </button> 279 </div> 280 </div> 281 </div> 282 </div> 283</div> <div class="custom-cursor cursor-none fixed inset-0 w-full h--full pointer-events-none z-[9999]"> 284 <div class="custom-cursor-circle cursor-none glass-fx fixed top-[-50px] left-[-50px] w-[120px] h-[120px] rounded-full flex items-center justify-center opacity-0 will-change-transform"> 285 <span class="custom-cursor-text cursor-none text-black text-[12px] tracking-[0.04em] uppercase font-medium all-caps"></span> 286 </div> 287 </div> 288 289 <header 290 x-data="{ 291 ...megaMenu({ navigation: [{"primary_submenu":[{"title":"Chartering a Yacht","url":"\/charter-a-yacht"},{"title":"Yachts for Charter","url":"\/charter-a-yacht\/yachts-for-charter"},{"title":"Destinations","url":"\/charter-a-yacht\/destinations"},{"title":"Summer 2026","url":"\/charter-a-yacht\/summer-2026"}],"id":7,"title":"Charter","id_mega_menu_default_media":0,"url":"#","secondary_submenu":[{"title":"Frequent Questions","url":"\/charter-a-yacht\/frequently-asked-questions"},{"title":"Yacht Charter Team","url":"\/charter-a-yacht\/charter-team"}],"card":[{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947467\/h-ml-l\/camperandnicholsons-_a_c&n_947467h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947467\/h-ml-l\/camperandnicholsons-_a_c&n_947467h-ml-l.webp"},"image_alt":"Summer 2026","image_2_alt":"Summer 2026","kicker":"Summer 2026","title":"The Art of Living","link":"\/charter-a-yacht\/summer-2026"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947466\/h-ml-l\/camperandnicholsons-_a_c&n_947466h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947466\/h-ml-l\/camperandnicholsons-_a_c&n_947466h-ml-l.webp"},"image_alt":"Destinations","image_2_alt":"Destinations","kicker":"Destinations","title":"Explore the World","link":"\/charter-a-yacht\/destinations"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947465\/h-ml-l\/camperandnicholsons-_a_c&n_947465h-ml-l.webp"},"image_2":{"type":"image","image":"
291https:\/\/camperandnicholsons.com\/IMAGE\/947465\/h-ml-l\/camperandnicholsons-_a_c&n_947465h-ml-l.webp"},"image_alt":"Yachts for Charter","image_2_alt":"Yachts for Charter","kicker":"Collection","title":"Yacht for Charter","link":"\/charter-a-yacht\/yachts-for-charter"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947468\/h-ml-l\/camperandnicholsons-_a_c&n_947468h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947468\/h-ml-l\/camperandnicholsons-_a_c&n_947468h-ml-l.webp"},"image_alt":"Charter","image_2_alt":"Charter","kicker":"Service","title":"Yacht Charter","link":"\/charter-a-yacht"}]},{"primary_submenu":[{"title":"Buying a Yacht","url":"\/buy-a-yacht"},{"title":"Yachts for Sale","url":"\/buy-a-yacht\/yachts-for-sale"},{"title":"New Build Yachts","url":"\/buy-a-yacht\/yachts-for-sale\/new-build-yachts"}],"id":8,"title":"Buy","id_mega_menu_default_media":0,"url":"#","secondary_submenu":[{"title":"Frequent Questions","url":"\/buy-a-yacht\/frequently-asked-questions"},{"title":"Yacht Sales Team","url":"\/buy-a-yacht\/sales-team"}],"card":[{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947462\/h-ml-l\/camperandnicholsons-_a_c&n_947462h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947462\/h-ml-l\/camperandnicholsons-_a_c&n_947462h-ml-l.webp"},"image_alt":"Motor yachts","image_2_alt":"Motor yachts","kicker":"Collection","title":"Motor Yachts","link":"\/buy-a-yacht\/yachts-for-sale\/motor-yachts"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947464\/h-ml-l\/camperandnicholsons-_a_c&n_947464h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947464\/h-ml-l\/camperandnicholsons-_a_c&n_947464h-ml-l.webp"},"image_alt":"Sailing Yachts","image_2_alt":"Sailing Yachts","kicker":"Collection","title":"Sailing Yachts","link":"\/buy-a-yacht\/yachts-for-sale\/sailing-yachts"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947461\/h-ml-l\/camperandnicholsons-_a_c&n_947461h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947461\/h-ml-l\/camperandnicholsons-_a_c&n_947461h-ml-l.webp"},"image_alt":"New Build Yachts","image_2_alt":"New Build Yachts","kicker":"Collection","title":"New Build Yachts","link":"\/buy-a-yacht\/yachts-for-sale\/new-build-yachts"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947463\/h-ml-l\/camperandnicholsons-_a_c&n_947463h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947463\/h-ml-l\/camperandnicholsons-_a_c&n_947463h-ml-l.webp"},"image_alt":"Yachts for Sale","image_2_alt":"Yachts for Sale","kicker":"Collection","title":"All Yachts for Sale","link":"\/buy-a-yacht\/yachts-for-sale"}]},{"primary_submenu":[{"title":"Selling a Yacht","url":"\/sell-a-yacht"},{"title":"Yachts Sold","url":"\/sell-a-yacht\/yachts-sold"},{"title":"Yacht Marketing","url":"\/owner-services\/yacht-marketing"}],"id":12,"title":"Sell","id_mega_menu_default_media":0,"url":"#","secondary_submenu":[{"title":"List a Yacht for Sale","url":"\/sell-a-yacht\/list-a-yacht"},{"title":"Frequent Questions","url":"\/sell-a-yacht\/frequently-asked-questions"},{"title":"Yacht Sales Team","url":"\/sell-a-yacht\/sales-team"}],"card":[{"image":{"type":"image","image":"
291https:\/\/camperandnicholsons.com\/IMAGE\/947460\/h-ml-l\/camperandnicholsons-_a_c&n_947460h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947460\/h-ml-l\/camperandnicholsons-_a_c&n_947460h-ml-l.webp"},"image_alt":"Sell","image_2_alt":"Sell","kicker":"Service","title":"Yacht Sales","link":"\/sell-a-yacht"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947458\/h-ml-l\/camperandnicholsons-_a_c&n_947458h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947458\/h-ml-l\/camperandnicholsons-_a_c&n_947458h-ml-l.webp"},"image_alt":"Yacht Marketing","image_2_alt":"Yacht Marketing","kicker":"Service","title":"Yacht Marketing","link":"\/owner-services\/yacht-marketing"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947442\/h-ml-l\/camperandnicholsons-_a_c&n_947442h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947442\/h-ml-l\/camperandnicholsons-_a_c&n_947442h-ml-l.webp"},"image_alt":"Team","image_2_alt":"Team","kicker":"About","title":"The Team","link":"\/team"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947459\/h-ml-l\/camperandnicholsons-_a_c&n_947459h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947459\/h-ml-l\/camperandnicholsons-_a_c&n_947459h-ml-l.webp"},"image_alt":"List a Yacht for Sale","image_2_alt":"List a Yacht for Sale","kicker":"Contact","title":"List a Yacht","link":"\/sell-a-yacht\/list-a-yacht"}]},{"primary_submenu":[{"title":"Building a Yacht","url":"\/build-a-yacht"},{"title":"New Build Sales","url":"\/build-a-yacht\/new-build-sales"},{"title":"Project Coordination","url":"\/build-a-yacht\/project-coordination"},{"title":"Yacht Refit","url":"\/build-a-yacht\/yacht-refit"},{"title":"Design","url":"\/design-studio"}],"id":11,"title":"Build","id_mega_menu_default_media":0,"url":"#","card":[{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947456\/h-ml-l\/camperandnicholsons-_a_c&n_947456h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947456\/h-ml-l\/camperandnicholsons-_a_c&n_947456h-ml-l.webp"},"image_alt":"New Build Sales","image_2_alt":"New Build Sales","kicker":"Service","title":"New Build Sales","link":"\/build-a-yacht\/new-build-sales"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947455\/h-ml-l\/camperandnicholsons-_a_c&n_947455h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947455\/h-ml-l\/camperandnicholsons-_a_c&n_947455h-ml-l.webp"},"image_alt":"Project Coordination","image_2_alt":"Project Coordination","kicker":"Service","title":"Project Coordination","link":"\/build-a-yacht\/project-coordination"},{"image":{"type":"image","image":"
291https:\/\/camperandnicholsons.com\/IMAGE\/947454\/h-ml-l\/camperandnicholsons-_a_c&n_947454h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947454\/h-ml-l\/camperandnicholsons-_a_c&n_947454h-ml-l.webp"},"image_alt":"Design","image_2_alt":"Design","kicker":"Service","title":"Design Studio","link":"\/design-studio"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947453\/h-ml-l\/camperandnicholsons-_a_c&n_947453h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947453\/h-ml-l\/camperandnicholsons-_a_c&n_947453h-ml-l.webp"},"image_alt":"Yacht Refit","image_2_alt":"Yacht Refit","kicker":"Service","title":"Yacht Refit","link":"\/build-a-yacht\/yacht-refit"}]},{"primary_submenu":[{"title":"Design Studio","url":"\/design-studio"},{"title":"Exterior Design","url":"\/design-studio\/exterior-design"},{"title":"Interior Design","url":"\/design-studio\/interior-design"},{"title":"Design & D\u00e9cor","url":"\/design-studio\/design-and-decor"},{"title":"Canvas by Camper & Nicholsons","url":"\/design-studio\/canvas"}],"id":407,"title":"Design","id_mega_menu_default_media":944161,"url":"#","card":[]},{"id":13,"title":"Manage","id_mega_menu_default_media":0,"url":"#","primary_submenu":[{"title":"Yacht Management","url":"\/owner-services\/yacht-management"},{"title":"Charter Management","url":"\/owner-services\/charter-management"},{"title":"Insurance solutions","url":"\/owner-services\/insurance-solutions"},{"title":"Corporate Services","url":"\/owner-services\/corporate-services"},{"title":"Crew Services","url":"\/owner-services\/crew-services"},{"title":"Purchasing","url":"\/owner-services\/Purchasing"}],"secondary_submenu":[{"title":"List a Yacht for Sale","url":"\/sell-a-yacht\/list-a-yacht"},{"title":"List a Yacht for Charter","url":"\/owner-services\/charter-management\/list-a-yacht"}],"card":[{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947452\/h-ml-l\/camperandnicholsons-_a_c&n_947452h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947452\/h-ml-l\/camperandnicholsons-_a_c&n_947452h-ml-l.webp"},"image_alt":"Yacht Management","image_2_alt":"Yacht Management","kicker":"Service","title":"Yacht Management","link":"\/owner-services\/yacht-management"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947451\/h-ml-l\/camperandnicholsons-_a_c&n_947451h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947451\/h-ml-l\/camperandnicholsons-_a_c&n_947451h-ml-l.webp"},"image_alt":"Insurance solutions","image_2_alt":"Insurance solutions","kicker":"Service","title":"Insurance Solutions","link":"\/owner-services\/insurance-solutions"},{"image":{"type":"image","image":"
291https:\/\/camperandnicholsons.com\/IMAGE\/947450\/h-ml-l\/camperandnicholsons-_a_c&n_947450h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947450\/h-ml-l\/camperandnicholsons-_a_c&n_947450h-ml-l.webp"},"image_alt":"Corporate Services","image_2_alt":"Corporate Services","kicker":"Service","title":"Corporate Services","link":"\/owner-services\/corporate-services"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947449\/h-ml-l\/camperandnicholsons-_a_c&n_947449h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947449\/h-ml-l\/camperandnicholsons-_a_c&n_947449h-ml-l.webp"},"image_alt":"Charter Management","image_2_alt":"Charter Management","kicker":"Service","title":"Charter Management","link":"\/owner-services\/charter-management"}]},{"primary_submenu":[{"title":"Work in Yachting","url":"\/crew-placement"},{"title":"Crew Positions","url":"\/crew-placement\/superyacht-crew-jobs"},{"title":"Register as Crew","url":"\/register"}],"id":14,"title":"Crew","id_mega_menu_default_media":0,"url":"#","card":[{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947448\/h-ml-l\/camperandnicholsons-_a_c&n_947448h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947448\/h-ml-l\/camperandnicholsons-_a_c&n_947448h-ml-l.webp"},"image_alt":"Crew","image_2_alt":"Crew","kicker":"Service","title":"Crew Placement","link":"\/crew-placement"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947447\/h-ml-l\/camperandnicholsons-_a_c&n_947447h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947447\/h-ml-l\/camperandnicholsons-_a_c&n_947447h-ml-l.webp"},"image_alt":"Crew Positions","image_2_alt":"Crew Positions","kicker":"Crew Positions","title":"Service","link":"\/crew-placement\/superyacht-crew-jobs"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947446\/h-ml-l\/camperandnicholsons-_a_c&n_947446h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947446\/h-ml-l\/camperandnicholsons-_a_c&n_947446h-ml-l.webp"},"image_alt":"Register as Crew","image_2_alt":"Register as Crew","kicker":"Register","title":"Sign Up Today","link":"\/register"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947445\/h-ml-l\/camperandnicholsons-_a_c&n_947445h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947445\/h-ml-l\/camperandnicholsons-_a_c&n_947445h-ml-l.webp"},"image_alt":"Contact","image_2_alt":"Contact","kicker":"Contact","title":"Speak to Our Team","link":"\/contact-us"}]},{"id":439,"title":"World of C&N","id_mega_menu_default_media":0,"url":"#","primary_submenu":[{"title":"Brand","url":"\/the-brand"},{"title":"Team","url":"\/team"},{"title":"Offices","url":"\/office"},{"title":"Academy","url":"\/academy"},{"title":"Campaigns","url":"\/campaigns"},{"title":"Real Estate","url":"https:\/\/cnrealestate.com"}],"secondary_submenu":[{"title":"Careers","url":"\/careers"},{"title":"Join Us","url":"\/careers\/our-job-offers"}],"card":[{"image":{"type":"image","image":"
291https:\/\/camperandnicholsons.com\/IMAGE\/947444\/h-ml-l\/camperandnicholsons-_a_c&n_947444h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947444\/h-ml-l\/camperandnicholsons-_a_c&n_947444h-ml-l.webp"},"image_alt":"Brand","image_2_alt":"Brand","kicker":"About","title":"The Brand","link":"\/the-brand"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947443\/h-ml-l\/camperandnicholsons-_a_c&n_947443h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947443\/h-ml-l\/camperandnicholsons-_a_c&n_947443h-ml-l.webp"},"image_alt":"Offices","image_2_alt":"Offices","kicker":"About","title":"The Locations","link":"\/office"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947442\/h-ml-l\/camperandnicholsons-_a_c&n_947442h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947442\/h-ml-l\/camperandnicholsons-_a_c&n_947442h-ml-l.webp"},"image_alt":"Team","image_2_alt":"Team","kicker":"About","title":"The Team","link":"\/team"},{"image":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947441\/h-ml-l\/camperandnicholsons-_a_c&n_947441h-ml-l.webp"},"image_2":{"type":"image","image":"https:\/\/camperandnicholsons.com\/IMAGE\/947441\/h-ml-l\/camperandnicholsons-_a_c&n_947441h-ml-l.webp"},"image_alt":"Academy","image_2_alt":"Academy","kicker":"About","title":"The Academy","link":"\/academy"}]},{"id":438,"title":"Contact","id_mega_menu_default_media":0,"url":"\/contact-us","card":[]}] }), 292 hasSavedYachts: false, 293 hasScrolled: false, 294 init() { 295 const savedYachts = JSON.parse(localStorage.getItem('savedYachts') || '[]'); 296 this.hasSavedYachts = savedYachts.length > 0; 297 298 // Set initial scroll state to prevent animation on page load 299 this.isAtTop = window.scrollY === 0; 300 // Don't set scrollDirection on init if already scrolled (page refresh) 301 if (window.scrollY === 0) { 302 this.scrollDirection = null; 303 } 304 }, 305 scrollDirection: null, 306 isAtTop: true, 307 }" 308 @scroll-direction.window=" 309 hasScrolled = true; 310 scrollDirection = $event.detail; 311 " 312 @scroll-to-top.window=" 313 isAtTop = $event.detail; 314 " 315 @yacht-saved.window=" 316 const savedYachts = JSON.parse(localStorage.getItem('savedYachts') || '[]'); 317 hasSavedYachts = savedYachts.length > 0; 318 319 // Add a small delay to ensure Tippy is initialized 320 setTimeout(() => { 321 if ($refs.favouritesButton && $refs.favouritesButton._tippy) { 322 // Update tooltip content and show it 323 $refs.favouritesButton._tippy.setContent('Added to favourites'); 324 $refs.favouritesButton._tippy.show(); 325 326 setTimeout(() => { 327 if ($refs.favouritesButton._tippy) { 328 // First hide the tooltip 329 $refs.favouritesButton._tippy.hide(); 330 331 // Wait for the hide animation to complete before resetting content 332 // Tippy's default animation duration is around 300ms 333 setTimeout(() => { 334 if ($refs.favouritesButton._tippy) { 335 $refs.favouritesButton._tippy.setContent('Favourites'); 336 } 337 }, 400); 338 } 339 }, 2000); 340 } else { 341 // Try again with a longer delay 342 setTimeout(() => { 343 if ($refs.favouritesButton && $refs.favouritesButton._tippy) { 344 $refs.favouritesButton._tippy.setContent('Added to favourites'); 345 $refs.favouritesButton._tippy.show(); 346 347 setTimeout(() => { 348 if ($refs.favouritesButton._tippy) { 349 $refs.favouritesButton._tippy.hide(); 350 setTimeout(() => { 351 if ($refs.favouritesButton._tippy) { 352 $refs.favouritesButton._tippy.setContent('Favourites'); 353 } 354 }, 400); 355 } 356 }, 2000); 357 } else { 358 } 359 }, 500); 360 } 361 }, 100); 362 " 363 @yacht-removed.window=" 364 const savedYachts = JSON.parse(localStorage.getItem('savedYachts') || '[]'); 365 hasSavedYachts = savedYachts.length > 0; 366 " 367 @hide-nav.window="hideNav = $event.detail" 368 @toggle-header.window="hideNav = $event.detail !== undefined ? $event.detail : !hideNav" 369 class="container absolute top-0 left-0 w-full z-[300] grid grid-cols-3 items-center h-[var(--header-height)] text-white theme-dark" 370 :class="{ 371 'transition-all': hasScrolled, 372 'pointer-events-none -translate-y-full opacity-0': hideNav, 373 '!fixed -translate-y-full': scrollDirection === 'down' && hasScrolled && !isAtTop, 374 '!fixed translate-y-0': scrollDirection === 'up' && hasScrolled || (isAtTop && hasScrolled), 375 '': false, 376 'bg-black': true && scrollDirection === 'up' && !isAtTop 377 }"> 378 <!-- Left section --> 379 <div class="flex items-center"> 380 <button 381 @click="mobileScreen === 'submenu' && window.innerWidth < 768 ? closeMobileSubmenu() : toggleMenu()" 382 class="group relative z-[250] flex items-center gap-[10px] h-[40p
382x] pr-[10px]"> 383 <!-- Hamburger lines (hidden when showing back arrow) --> 384 <div class="js-menu-button-closed flex items-center gap-[10px] text-white" 385 x-show="!(mobileScreen === 'submenu' && window.innerWidth < 768)"> 386 <div class="relative w-[16px] h-[7px]"> 387 <div class="absolute transition-all group-hover:translate-y-[-2px] w-[16px] h-[1px] bg-current top-0 left-0"></div> 388 <div class="absolute transition-all group-hover:translate-y-[2px] w-[16px] h-[1px] bg-current bottom-0 left-0"></div> 389 </div> 390 <span class="body-12 font-medium all-caps p-fix whitespace-nowrap">Menu</span> 391 </div> 392 <div class="js-menu-button-open flex items-center gap-[10px] text-black absolute left-0 opacity-0" 393 x-show="!(mobileScreen === 'submenu' && window.innerWidth < 768)"> 394 <div class="relative w-[16px] h-[7px]"> 395 <div class="absolute transition-all group-hover:translate-y-[-2px] w-[16px] h-[1px] bg-current top-0 left-0"></div> 396 <div class="absolute transition-all group-hover:translate-y-[2px] w-[16px] h-[1px] bg-current bottom-0 left-0"></div> 397 </div> 398 <span class="body-12 font-medium all-caps p-fix whitespace-nowrap">Close</span> 399 </div> 400 401 <div x-cloak 402 x-show="mobileScreen === 'submenu' && window.innerWidth < 768" 403 class="js-arrow-icon opacity-0 text-black"> 404 <svg class="w-[18px] h-[18px]" aria-hidden="true" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 405 <path d="M7.9496 13.7077L2.69922 9.1027L7.9496 4.5" stroke="currentColor" stroke-miterlimit="10" /> 406 <path d="M2.69922 9.10156L15.2992 9.10156" stroke="currentColor" stroke-miterlimit="10" /> 407 </svg> 408 </div> 409 <div class="relative whitespace-nowrap h-full flex items-center"> 410 411 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 412 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 0">Charter</span> 413 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 414 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 1">Buy</span> 415 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 416 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 2">Sell</span> 417 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 418 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 3">Build</span> 419 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 420 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 4">Design</span> 421 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 422 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 5">Manage</span> 423 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 424 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 6">Crew</span>
425 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 426 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 7">World of C&N</span> 427 <span x-cloak class="body-12 font-medium all-caps p-fix absolute inset-0 flex items-center js-back-text opacity-0 text-black" 428 x-show="mobileScreen === 'submenu' && window.innerWidth < 768 && mobileSelectedNav === 8">Contact</span> 429 </div> 430 </button> 431 <div class="h-[16px] w-[1px] mx-[10px] flex-none relative z-10 bg-white/20 hidden r:block"></div> 432 <nav class="h-[40px] hidden r:block"> 433 <ul class="h-full body-12 p-fix font-medium uppercase flex items-center gap-[10px]"> 434 <li class="h-full flex items-center"><a class="relative before:absolute before:content-[''] before:w-0 before:h-[1px] before:bg-current before:bottom-0 before:left-0 hover:before:w-full before:transition-all h-full px-[10px]" href="/charter-a-yacht"><span class="all-caps relative flex items-center h-full ">Charter</span></a></li> 435 <li class="h-full flex items-center"><a class="relative before:absolute before:content-[''] before:w-0 before:h-[1px] before:bg-current before:bottom-0 before:left-0 hover:before:w-full before:transition-all h-full px-[10px]" href="/buy-a-yacht"><span class="all-caps relative flex items-center h-full ">Buy</span></a></li> 436 <li class="h-full flex items-center"><a class="relative before:absolute before:content-[''] before:w-0 before:h-[1px] before:bg-current before:bottom-0 before:left-0 hover:before:w-full before:transition-all h-full px-[10px]" href="/build-a-yacht"><span class="all-caps relative flex items-center h-full ">Build</span></a></li> 437 <li class="h-full flex items-center"><a class="relative before:absolute before:content-[''] before:w-0 before:h-[1px] before:bg-current before:bottom-0 before:left-0 hover:before:w-full before:transition-all h-full px-[10px]" href="/design-studio"><span class="all-caps relative flex items-center h-full ">Design</span></a></li> 438 </ul> 439 </nav> 440 441 <!-- Megamenu --> 442 <div x-ref="megaMenu" x-cloak class="fixed flex flex-col s:flex-row inset-0 w-screen !h-[100dvh] h-screen z-[200]" :class="{ 'visible pointer-events-auto': isMegaMenuAnimating, 'invisible pointer-events-none': !isMegaMenuAnimating }"> 443 <!-- Mobile glass background --> 444 <div class="js-mega-menu-overlay-mobile absolute inset-0 glass-fx -translate-x-full s:hidden"></div> 445 446 <div class="absolute inset-y-0 left-0 w-1/2 overflow-hidden hidden s:block pointer-events-none"> 447 <div class="js-mega-menu-overlay-left absolute inset-0 w-full -translate-x-full h-full glass-fx"></div> 448 </div> 449 450 <div class="relative flex-1 flex flex-col h-full" data-lenis-prevent x-data="{ currencyOpen: false }"> 451 <div class="flex-1 pt-[56px] r:pt-[76px] overflow-y-auto transition-opacity duration-200" :class="{ 'opacity-15 pointer-events-none': currencyOpen }"> 452 <!-- Desktop Navigation --> 453 <div class="relative z-10 flex flex-row hidden s:flex"> 454 <!-- Main Nav --> 455 <nav class="flex-1 text-black" x-data="{ hoveredNav: null }"> 456 <ul class="flex flex-col gap-[10px] group" @mouseleave="hoveredNav = null"> 457 <li class="relative overflow-hidden mb-[2px]"> 458 <a @click="toggleSubmenu(0, $event)" 459 @mouseenter="hoveredNav = 0" 460 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] curs
460or-pointer text-black transition-all ease-in-out duration-300" 461 x-bind:class="{ 462 'text-opacity-100': hoveredNav === null || hoveredNav === 0, 463 'text-opacity-30': hoveredNav !== null && hoveredNav !== 0, 464 '!text-opacity-100': activeNav === 0 }" 465 href="#"> 466 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Charter</span></div> 467 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 468 x-bind:class="{ 469 '!translate-x-0 !opacity-100': activeNav === 0 }"> 470 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 471 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 472 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 473 </svg> 474 </span> 475 </a> 476 </li> 477 <li class="relative overflow-hidden mb-[2px]"> 478 <a @click="toggleSubmenu(1, $event)" 479 @mouseenter="hoveredNav = 1" 480 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 481 x-bind:class="{ 482 'text-opacity-100': hoveredNav === null || hoveredNav === 1, 483 'text-opacity-30': hoveredNav !== null && hoveredNav !== 1, 484 '!text-opacity-100': activeNav === 1 }" 485 href="#"> 486 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Buy</span></div> 487 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 488 x-bind:class="{ 489 '!translate-x-0 !opacity-100': activeNav === 1 }"> 490 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 491 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 492 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 493 </svg> 494 </span> 495 </a> 496 </li> 497 <li class="relative overflow-hidden mb-[2px]"> 498 <a @click="toggleSubmenu(2, $event)" 499 @mouseenter="hoveredNav = 2" 500 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 501 x-bind:class="{ 502 'text-opacity-100': hoveredNav === null || hoveredNav === 2, 503 'text-opacity-30': hoveredNav !== null && hoveredNav !== 2, 504 '!text-opacity-100': activeNav === 2 }" 505 href="#"> 506 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Sell</span></div>
507 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 508 x-bind:class="{ 509 '!translate-x-0 !opacity-100': activeNav === 2 }"> 510 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 511 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 512 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 513 </svg> 514 </span> 515 </a> 516 </li> 517 <li class="relative overflow-hidden mb-[2px]"> 518 <a @click="toggleSubmenu(3, $event)" 519 @mouseenter="hoveredNav = 3" 520 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 521 x-bind:class="{ 522 'text-opacity-100': hoveredNav === null || hoveredNav === 3, 523 'text-opacity-30': hoveredNav !== null && hoveredNav !== 3, 524 '!text-opacity-100': activeNav === 3 }" 525 href="#"> 526 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Build</span></div> 527 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 528 x-bind:class="{ 529 '!translate-x-0 !opacity-100': activeNav === 3 }"> 530 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 531 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 532 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 533 </svg> 534 </span> 535 </a> 536 </li> 537 <li class="relative overflow-hidden mb-[2px]"> 538 <a @click="toggleSubmenu(4, $event)" 539 @mouseenter="hoveredNav = 4" 540 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 541 x-bind:class="{ 542 'text-opacity-100': hoveredNav === null || hoveredNav === 4, 543 'text-opacity-30': hoveredNav !== null && hoveredNav !== 4, 544 '!text-opacity-100': activeNav === 4 }" 545 href="#"> 546 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Design</span></div> 547 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 548 x-bind:class="{ 549 '!translate-x-0 !opacity-100': activeNav === 4 }"> 550 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 551 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 552 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 553 </svg> 554 </span> 555 </a> 556 </li> 557 <li class="relative overflow-hidden mb-[2px]"> 558 <a @click="toggleSubmenu(5, $event)" 559 @mouseenter="hoveredNav = 5" 560 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] curs
560or-pointer text-black transition-all ease-in-out duration-300" 561 x-bind:class="{ 562 'text-opacity-100': hoveredNav === null || hoveredNav === 5, 563 'text-opacity-30': hoveredNav !== null && hoveredNav !== 5, 564 '!text-opacity-100': activeNav === 5 }" 565 href="#"> 566 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Manage</span></div> 567 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 568 x-bind:class="{ 569 '!translate-x-0 !opacity-100': activeNav === 5 }"> 570 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 571 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 572 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 573 </svg> 574 </span> 575 </a> 576 </li> 577 <li class="relative overflow-hidden mb-[2px]"> 578 <a @click="toggleSubmenu(6, $event)" 579 @mouseenter="hoveredNav = 6" 580 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 581 x-bind:class="{ 582 'text-opacity-100': hoveredNav === null || hoveredNav === 6, 583 'text-opacity-30': hoveredNav !== null && hoveredNav !== 6, 584 '!text-opacity-100': activeNav === 6 }" 585 href="#"> 586 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Crew</span></div> 587 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 588 x-bind:class="{ 589 '!translate-x-0 !opacity-100': activeNav === 6 }"> 590 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 591 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 592 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 593 </svg> 594 </span> 595 </a> 596 </li> 597 <li class="relative overflow-hidden mb-[2px]"> 598 <a @click="toggleSubmenu(7, $event)" 599 @mouseenter="hoveredNav = 7" 600 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 601 x-bind:class="{ 602 'text-opacity-100': hoveredNav === null || hoveredNav === 7, 603 'text-opacity-30': hoveredNav !== null && hoveredNav !== 7, 604 '!text-opacity-100': activeNav === 7 }" 605 href="#"> 606 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">World of C&N</span></div>
607 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 608 x-bind:class="{ 609 '!translate-x-0 !opacity-100': activeNav === 7 }"> 610 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 611 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 612 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 613 </svg> 614 </span> 615 </a> 616 </li> 617 <li class="relative overflow-hidden mb-[2px]"> 618 <a @click="toggleSubmenu(8, $event)" 619 @mouseenter="hoveredNav = 8" 620 class="w-full inline-flex items-center justify-between px-[20px] 2xl:px-[40px] body-14 s:h18 s:h-[58px] r:h20 r:h-[68px] all-caps h-[48px] cursor-pointer text-black transition-all ease-in-out duration-300" 621 x-bind:class="{ 622 'text-opacity-100': hoveredNav === null || hoveredNav === 8, 623 'text-opacity-30': hoveredNav !== null && hoveredNav !== 8, 624 '!text-opacity-100': activeNav === 8 }" 625 href="/contact-us"> 626 <div class="relative overflow-hidden"><span class="block js-nav-item opacity-0 translate-y-full">Contact</span></div> 627 <span class="block transition-all ease-in-out duration-300 -translate-x-2 opacity-0" 628 x-bind:class="{ 629 '!translate-x-0 !opacity-100': activeNav === 8 }"> 630 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 631 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 632 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 633 </svg> 634 </span> 635 </a> 636 </li> 637 </ul> 638 </nav> 639 640 <!-- Submenu - Desktop only --> 641 <div class="flex-1 mt-[10px] text-black pl-[20px]"> 642 <!-- Primary Submenu --> 643 <ul> 644 <li class="group relative mb-[4px] overflow-hidden" 645 x-show="activeNav === 0" 646 x-cloak> 647 <a href="/charter-a-yacht" 648 class="body-16 relative flex items-center h-[40px]"> 649 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 650 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Chartering a Yacht</span> 651 </a> 652 </li> 653 <li class="group relative mb-[4px] overflow-hidden" 654 x-show="activeNav === 0" 655 x-cloak> 656 <a href="/charter-a-yacht/yachts-for-charter" 657 class="body-16 relative flex items-center h-[40px]">
658 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 659 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yachts for Charter</span> 660 </a> 661 </li> 662 <li class="group relative mb-[4px] overflow-hidden" 663 x-show="activeNav === 0" 664 x-cloak> 665 <a href="/charter-a-yacht/destinations" 666 class="body-16 relative flex items-center h-[40px]"> 667 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 668 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Destinations</span> 669 </a> 670 </li> 671 <li class="group relative mb-[4px] overflow-hidden" 672 x-show="activeNav === 0" 673 x-cloak> 674 <a href="/charter-a-yacht/summer-2026" 675 class="body-16 relative flex items-center h-[40px]"> 676 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 677 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Summer 2026</span> 678 </a> 679 </li> 680 <li class="group relative mb-[4px] overflow-hidden" 681 x-show="activeNav === 1" 682 x-cloak> 683 <a href="/buy-a-yacht" 684 class="body-16 relative flex items-center h-[40px]"> 685 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 686 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Buying a Yacht</span> 687 </a> 688 </li> 689 <li class="group relative mb-[4px] overflow-hidden" 690 x-show="activeNav === 1" 691 x-cloak> 692 <a href="/buy-a-yacht/yachts-for-sale" 693 class="body-16 relative flex items-center h-[40px]">
694 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 695 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yachts for Sale</span> 696 </a> 697 </li> 698 <li class="group relative mb-[4px] overflow-hidden" 699 x-show="activeNav === 1" 700 x-cloak> 701 <a href="/buy-a-yacht/yachts-for-sale/new-build-yachts" 702 class="body-16 relative flex items-center h-[40px]"> 703 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 704 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">New Build Yachts</span> 705 </a> 706 </li> 707 <li class="group relative mb-[4px] overflow-hidden" 708 x-show="activeNav === 2" 709 x-cloak> 710 <a href="/sell-a-yacht" 711 class="body-16 relative flex items-center h-[40px]"> 712 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 713 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Selling a Yacht</span> 714 </a> 715 </li> 716 <li class="group relative mb-[4px] overflow-hidden" 717 x-show="activeNav === 2" 718 x-cloak> 719 <a href="/sell-a-yacht/yachts-sold" 720 class="body-16 relative flex items-center h-[40px]"> 721 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 722 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yachts Sold</span> 723 </a> 724 </li> 725 <li class="group relative mb-[4px] overflow-hidden" 726 x-show="activeNav === 2" 727 x-cloak> 728 <a href="/owner-services/yacht-marketing" 729 class="body-16 relative flex items-center h-[40px]">
730 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 731 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yacht Marketing</span> 732 </a> 733 </li> 734 <li class="group relative mb-[4px] overflow-hidden" 735 x-show="activeNav === 3" 736 x-cloak> 737 <a href="/build-a-yacht" 738 class="body-16 relative flex items-center h-[40px]"> 739 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 740 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Building a Yacht</span> 741 </a> 742 </li> 743 <li class="group relative mb-[4px] overflow-hidden" 744 x-show="activeNav === 3" 745 x-cloak> 746 <a href="/build-a-yacht/new-build-sales" 747 class="body-16 relative flex items-center h-[40px]"> 748 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 749 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">
749New Build Sales</span> 750 </a> 751 </li> 752 <li class="group relative mb-[4px] overflow-hidden" 753 x-show="activeNav === 3" 754 x-cloak> 755 <a href="/build-a-yacht/project-coordination" 756 class="body-16 relative flex items-center h-[40px]"> 757 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 758 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Project Coordination</span> 759 </a> 760 </li> 761 <li class="group relative mb-[4px] overflow-hidden" 762 x-show="activeNav === 3" 763 x-cloak> 764 <a href="/build-a-yacht/yacht-refit" 765 class="body-16 relative flex items-center h-[40px]"> 766 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 767 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yacht Refit</span> 768 </a> 769 </li> 770 <li class="group relative mb-[4px] overflow-hidden" 771 x-show="activeNav === 3" 772 x-cloak> 773 <a href="/design-studio" 774 class="body-16 relative flex items-center h-[40px]"> 775 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 776 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Design</span> 777 </a> 778 </li> 779 <li class="group relative mb-[4px] overflow-hidden" 780 x-show="activeNav === 4" 781 x-cloak> 782 <a href="/design-studio" 783 class="body-16 relative flex items-center h-[40px]"> 784 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 785 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Design Studio</span> 786 </a> 787 </li> 788 <li class="group relative mb-[4px] overflow-hidden" 789 x-show="activeNav === 4" 790 x-cloak> 791 <a href="/design-studio/exterior-design" 792 class="body-16 relative flex items-center h-[40px]">
793 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 794 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Exterior Design</span> 795 </a> 796 </li> 797 <li class="group relative mb-[4px] overflow-hidden" 798 x-show="activeNav === 4" 799 x-cloak> 800 <a href="/design-studio/interior-design" 801 class="body-16 relative flex items-center h-[40px]"> 802 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 803 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Interior Design</span> 804 </a> 805 </li> 806 <li class="group relative mb-[4px] overflow-hidden" 807 x-show="activeNav === 4" 808 x-cloak> 809 <a href="/design-studio/design-and-decor" 810 class="body-16 relative flex items-center h-[40px]"> 811 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 812 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Design & Décor</span> 813 </a> 814 </li> 815 <li class="group relative mb-[4px] overflow-hidden" 816 x-show="activeNav === 4" 817 x-cloak> 818 <a href="/design-studio/canvas" 819 class="body-16 relative flex items-center h-[40px]"> 820 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 821 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Canvas by Camper & Nicholsons</span> 822 </a> 823 </li> 824 <li class="group relative mb-[4px] overflow-hidden" 825 x-show="activeNav === 5" 826 x-cloak> 827 <a href="/owner-services/yacht-management" 828 class="body-16 relative flex items-center h-[40px]">
829 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 830 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yacht Management</span> 831 </a> 832 </li> 833 <li class="group relative mb-[4px] overflow-hidden" 834 x-show="activeNav === 5" 835 x-cloak> 836 <a href="/owner-services/charter-management" 837 class="body-16 relative flex items-center h-[40px]"> 838 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 839 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Charter Management</span> 840 </a> 841 </li> 842 <li class="group relative mb-[4px] overflow-hidden" 843 x-show="activeNav === 5" 844 x-cloak> 845 <a href="/owner-services/insurance-solutions" 846 class="body-16 relative flex items-center h-[40px]"> 847 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 848 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Insurance solutions</span> 849 </a> 850 </li> 851 <li class="group relative mb-[4px] overflow-hidden" 852 x-show="activeNav === 5" 853 x-cloak> 854 <a href="/owner-services/corporate-services" 855 class="body-16 relative flex items-center h-[40px]"> 856 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 857 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Corporate Services</span> 858 </a> 859 </li> 860 <li class="group relative mb-[4px] overflow-hidden" 861 x-show="activeNav === 5" 862 x-cloak> 863 <a href="/owner-services/crew-services" 864 class="body-16 relative flex items-center h-[40px]"> 865 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span>
866 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Crew Services</span> 867 </a> 868 </li> 869 <li class="group relative mb-[4px] overflow-hidden" 870 x-show="activeNav === 5" 871 x-cloak> 872 <a href="/owner-services/Purchasing" 873 class="body-16 relative flex items-center h-[40px]"> 874 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 875 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Purchasing</span> 876 </a> 877 </li> 878 <li class="group relative mb-[4px] overflow-hidden" 879 x-show="activeNav === 6" 880 x-cloak> 881 <a href="/crew-placement" 882 class="body-16 relative flex items-center h-[40px]"> 883 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 884 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Work in Yachting</span> 885 </a> 886 </li> 887 <li class="group relative mb-[4px] overflow-hidden" 888 x-show="activeNav === 6" 889 x-cloak> 890 <a href="/crew-placement/superyacht-crew-jobs" 891 class="body-16 relative flex items-center h-[40px]"> 892 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 893 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Crew Positions</span> 894 </a> 895 </li> 896 <li class="group relative mb-[4px] overflow-hidden" 897 x-show="activeNav === 6" 898 x-cloak> 899 <a href="/register" 900 class="body-16 relative flex items-center h-[40px]"> 901 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span>
902 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Register as Crew</span> 903 </a> 904 </li> 905 <li class="group relative mb-[4px] overflow-hidden" 906 x-show="activeNav === 7" 907 x-cloak> 908 <a href="/the-brand" 909 class="body-16 relative flex items-center h-[40px]"> 910 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 911 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Brand</span> 912 </a> 913 </li> 914 <li class="group relative mb-[4px] overflow-hidden" 915 x-show="activeNav === 7" 916 x-cloak> 917 <a href="/team" 918 class="body-16 relative flex items-center h-[40px]"> 919 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 920 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Team</span> 921 </a> 922 </li> 923 <li class="group relative mb-[4px] overflow-hidden" 924 x-show="activeNav === 7" 925 x-cloak> 926 <a href="/office" 927 class="body-16 relative flex items-center h-[40px]"> 928 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 929 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Offices</span> 930 </a> 931 </li> 932 <li class="group relative mb-[4px] overflow-hidden" 933 x-show="activeNav === 7" 934 x-cloak> 935 <a href="/academy" 936 class="body-16 relative flex items-center h-[40px]"> 937 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 938 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Academy</span> 939 </a> 940 </li> 941 <li class="group relative mb-[4px] overflow-hidden" 942 x-show="activeNav === 7" 943 x-cloak> 944 <a href="/campaigns" 945 class="body-16 relative flex items-center h-[40px]">
946 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 947 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Campaigns</span> 948 </a> 949 </li> 950 <li class="group relative mb-[4px] overflow-hidden" 951 x-show="activeNav === 7" 952 x-cloak> 953 <a href="https://cnrealestate.com" 954 class="body-16 relative flex items-center h-[40px]"> 955 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 956 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Real Estate</span> 957 </a> 958 </li> 959 </ul> 960 <!-- Secondary Submenu --> 961 <ul class="mt-[30px]"> 962 <li class="group relative mb-[2px] overflow-hidden" 963 x-show="activeNav === 0" 964 x-cloak> 965 <a href="/charter-a-yacht/frequently-asked-questions" 966 class="body-14 relative flex items-center h-[40px]"> 967 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 968 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Frequent Questions</span> 969 </a> 970 </li> 971 <li class="group relative mb-[2px] overflow-hidden" 972 x-show="activeNav === 0" 973 x-cloak> 974 <a href="/charter-a-yacht/charter-team" 975 class="body-14 relative flex items-center h-[40px]"> 976 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 977 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Yacht Charter Team</span> 978 </a> 979 </li> 980 <li class="group relative mb-[2px] overflow-hidden" 981 x-show="activeNav === 1" 982 x-cloak> 983 <a href="/buy-a-yacht/frequently-asked-questions" 984 class="body-14 relative flex items-center h-[40px]">
985 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 986 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Frequent Questions</span> 987 </a> 988 </li> 989 <li class="group relative mb-[2px] overflow-hidden" 990 x-show="activeNav === 1" 991 x-cloak> 992 <a href="/buy-a-yacht/sales-team" 993 class="body-14 relative flex items-center h-[40px]"> 994 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 995 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Yacht Sales Team</span> 996 </a> 997 </li> 998 <li class="group relative mb-[2px] overflow-hidden" 999 x-show="activeNav === 2" 1000 x-cloak> 1001 <a href="/sell-a-yacht/list-a-yacht" 1002 class="body-14 relative flex items-center h-[40px]"> 1003 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1004 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">List a Yacht for Sale</span> 1005 </a> 1006 </li> 1007 <li class="group relative mb-[2px] overflow-hidden" 1008 x-show="activeNav === 2" 1009 x-cloak> 1010 <a href="/sell-a-yacht/frequently-asked-questions" 1011 class="body-14 relative flex items-center h-[40px]"> 1012 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1013 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Frequent Questions</span> 1014 </a> 1015 </li> 1016 <li class="group relative mb-[2px] overflow-hidden" 1017 x-show="activeNav === 2" 1018 x-cloak> 1019 <a href="/sell-a-yacht/sales-team" 1020 class="body-14 relative flex items-center h-[40px]">
1021 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1022 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Yacht Sales Team</span> 1023 </a> 1024 </li> 1025 <li class="group relative mb-[2px] overflow-hidden" 1026 x-show="activeNav === 5" 1027 x-cloak> 1028 <a href="/sell-a-yacht/list-a-yacht" 1029 class="body-14 relative flex items-center h-[40px]"> 1030 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1031 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">List a Yacht for Sale</span> 1032 </a> 1033 </li> 1034 <li class="group relative mb-[2px] overflow-hidden" 1035 x-show="activeNav === 5" 1036 x-cloak> 1037 <a href="/owner-services/charter-management/list-a-yacht" 1038 class="body-14 relative flex items-center h-[40px]"> 1039 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1040 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">List a Yacht for Charter</span> 1041 </a> 1042 </li> 1043 <li class="group relative mb-[2px] overflow-hidden" 1044 x-show="activeNav === 7" 1045 x-cloak> 1046 <a href="/careers" 1047 class="body-14 relative flex items-center h-[40px]"> 1048 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1049 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Careers</span> 1050 </a> 1051 </li> 1052 <li class="group relative mb-[2px] overflow-hidden" 1053 x-show="activeNav === 7" 1054 x-cloak> 1055 <a href="/careers/our-job-offers" 1056 class="body-14 relative flex items-center h-[40px]">
1057 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[10px]"></span> 1058 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[10px]">Join Us</span> 1059 </a> 1060 </li> 1061 </ul> 1062 </div> 1063 </div> 1064 1065 <!-- Mobile Navigation - Completely separate structure --> 1066 <div class="relative z-10 block s:hidden h-full overflow-y-auto" data-lenis-prevent> 1067 <!-- Mobile Main Screen --> 1068 <div class="js-mobile-menu-main h-full" style="display: block;"> 1069 <!-- Primary Navigation Items --> 1070 <nav class="text-black"> 1071 <ul class="flex flex-col gap-[10px]"> 1072 <li class="relative overflow-hidden mb-[2px]"> 1073 <a @click="openMobileSubmenu(0)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1074 href="javascript:void(0)"> 1075 <div class="relative overflow-hidden"> 1076 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Charter</span> 1077 </div> 1078 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1079 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1080 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1081 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1082 </svg> 1083 </span> 1084 </a> 1085 </li> 1086 <li class="relative overflow-hidden mb-[2px]"> 1087 <a @click="openMobileSubmenu(1)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1088 href="javascript:void(0)"> 1089 <div class="relative overflow-hidden"> 1090 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Buy</span> 1091 </div> 1092 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1093 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1094 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1095 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1096 </svg> 1097 </span> 1098 </a> 1099 </li> 1100 <li class="relative overflow-hidden mb-[2px]"> 1101 <a @click="openMobileSubmenu(2)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] curs
1101or-pointer text-black" 1102 href="javascript:void(0)"> 1103 <div class="relative overflow-hidden"> 1104 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Sell</span> 1105 </div> 1106 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1107 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1108 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1109 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1110 </svg> 1111 </span> 1112 </a> 1113 </li> 1114 <li class="relative overflow-hidden mb-[2px]"> 1115 <a @click="openMobileSubmenu(3)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1116 href="javascript:void(0)"> 1117 <div class="relative overflow-hidden"> 1118 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Build</span> 1119 </div> 1120 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1121 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1122 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1123 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1124 </svg> 1125 </span> 1126 </a> 1127 </li> 1128 <li class="relative overflow-hidden mb-[2px]"> 1129 <a @click="openMobileSubmenu(4)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1130 href="javascript:void(0)"> 1131 <div class="relative overflow-hidden"> 1132 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Design</span> 1133 </div> 1134 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1135 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1136 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1137 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1138 </svg> 1139 </span> 1140 </a> 1141 </li> 1142 <li class="relative overflow-hidden mb-[2px]"> 1143 <a @click="openMobileSubmenu(5)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] curs
1143or-pointer text-black" 1144 href="javascript:void(0)"> 1145 <div class="relative overflow-hidden"> 1146 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Manage</span> 1147 </div> 1148 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1149 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1150 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1151 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1152 </svg> 1153 </span> 1154 </a> 1155 </li> 1156 <li class="relative overflow-hidden mb-[2px]"> 1157 <a @click="openMobileSubmenu(6)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1158 href="javascript:void(0)"> 1159 <div class="relative overflow-hidden"> 1160 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Crew</span> 1161 </div> 1162 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1163 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1164 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1165 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1166 </svg> 1167 </span> 1168 </a> 1169 </li> 1170 <li class="relative overflow-hidden mb-[2px]"> 1171 <a @click="openMobileSubmenu(7)" class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] cursor-pointer text-black" 1172 href="javascript:void(0)"> 1173 <div class="relative overflow-hidden"> 1174 <span class="block js-nav-item-mobile opacity-0 translate-y-full">World of C&N</span> 1175 </div> 1176 <span class="block js-arrow-mobile opacity-0 -translate-x-[10px]"> 1177 <svg class="block text-black" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 1178 <path d="M10.0497 13.7077L15.3 9.1027L10.0497 4.5" stroke="currentColor" stroke-miterlimit="10" /> 1179 <path d="M15.3 9.10196H2.70005" stroke="currentColor" stroke-miterlimit="10" /> 1180 </svg> 1181 </span> 1182 </a> 1183 </li> 1184 <li class="relative overflow-hidden mb-[2px]"> 1185 <a class="w-full inline-flex items-center justify-between px-[20px] body-14 s:h18 all-caps h-[48px] s:h-[58px] curs
1185or-pointer text-black" 1186 href="/contact-us"> 1187 <div class="relative overflow-hidden"> 1188 <span class="block js-nav-item-mobile opacity-0 translate-y-full">Contact</span> 1189 </div> 1190 </a> 1191 </li> 1192 </ul> 1193 </nav> 1194 1195 <!-- Additional Menu Items - Only in main screen --> 1196 <div class="px-[20px] mt-[20px]"> 1197 <ul class="js-mobile-menu-additional-container opacity-0 space-y-[8px] mb-[40px] border-t border-black/10 pt-[20px]"> 1198 <li class="js-mobile-menu-additional opacity-0 translate-y-full"> 1199 <a href="/contact-us" class="body-16 text-black py-[8px] inline-block">Make an Enquiry</a> 1200 </li> 1201 <li class="js-mobile-menu-additional opacity-0 translate-y-full"> 1202 <a href="/office" class="body-16 text-black py-[8px] inline-block">Find an Office</a> 1203 </li> 1204 <li class="js-mobile-menu-additional opacity-0 translate-y-full"> 1205 <a href="/login" class="body-16 text-black py-[8px] inline-block">Account</a> 1206 </li> 1207 </ul> 1208 1209 <!-- Need help section --> 1210 <div> 1211 <p class="body-14 text-black/60 mb-[16px] js-mobile-menu-additional opacity-0 translate-y-full">Need help?</p> 1212 <ul class="space-y-[8px]"> 1213 <li class="js-mobile-menu-additional opacity-0 translate-y-full"> 1214 <a href="/frequently-asked-questions" class="body-16 text-black py-[8px] inline-block">Frequently Asked Questions</a> 1215 </li> 1216 </ul> 1217 </div> 1218 </div> 1219 </div> 1220 1221 <!-- Mobile Submenu Screen - Hidden by default --> 1222 <div class="js-mobile-menu-submenu h-full bg-transparent overflow-y-auto" style="display: none;"> 1223 <!-- Submenu items --> 1224 <div x-show="mobileSelectedNav === 0" class="flex flex-col s:flex-row h-full"> 1225 <!-- Submenu links column --> 1226 <div class="s:w-1/2 s:pr-[20px]"> 1227 <ul class="px-[20px] mb-[30px]"> 1228 <li class="mb-[8px] js-mobile-submenu-item"> 1229 <a href="/charter-a-yacht" class="body-16 text-black py-[8px] inline-block"> 1230 Chartering a Yacht </a> 1231 </li> 1232 <li class="mb-[8px] js-mobile-submenu-item"> 1233 <a href="/charter-a-yacht/yachts-for-charter" class="body-16 text-black py-[8px] inline-block"> 1234 Yachts for Charter </a> 1235 </li> 1236 <li class="mb-[8px] js-mobile-submenu-item"> 1237 <a href="/charter-a-yacht/destinations" class="body-16 text-black py-[8px] inline-block"> 1238 Destinations </a> 1239 </li> 1240 <li class="mb-[8px] js-mobile-submenu-item"> 1241 <a href="/charter-a-yacht/summer-2026" class="body-16 text-black py-[8px] inline-block"> 1242 Summer 2026 </a> 1243 </li> 1244 </ul> 1245 1246 <ul class="px-[20px] pt-[20px] border-t border-black/10"> 1247 <li class="mb-[8px] js-mobile-submenu-item"> 1248 <a href="/charter-a-yacht/frequently-asked-questions" class="body-14 text-black py-[8px] inline-block"> 1249 Frequent Questions </a> 1250 </li> 1251 <li class="mb-[8px] js-mobile-submenu-item"> 1252 <a href="/charter-a-yacht/charter-team" class="body-14 text-black py-[8px] inline-block"> 1253 Yacht Charter Team </a> 1254 </li> 1255 </ul> 1256 </div> 1257 1258 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1259 <div class="block flex-1 s:w-1/2"> 1260 <div class="block gap-0 mt-[40px] s:mt-0"> 1261 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1262 <div class="absolute inset-0 z-10 w-full h-full"> 1263 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1264 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1265 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1265com/IMAGE/947467/s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1266 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-m/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1267 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1268 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1269 <img src="https://camperandnicholsons.com/IMAGE/947467/h-ml-l/camperandnicholsons-_a_c&n_947467h-ml-l.webp" class="" alt="" loading='lazy' > 1270 </picture> 1271 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1272 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1273 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-m/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1274 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1275 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 1276 <img src="https://camperandnicholsons.com/IMAGE/947467/h-ml-l/camperandnicholsons-_a_c&n_947467h-ml-l.webp" class="" alt="" loading='lazy' > 1277 </picture> 1278 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1279 <div class="mt-auto"> 1280 <h3 class="h10 all-caps mb-[10px]">Summer 2026</h3> 1281 <a href="/charter-a-yacht/summer-2026" class="h18 box-link">The Art of Living</a> 1282 </div> 1283 </div> 1284 </div> 1285 </div> 1286 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1287 <div class="absolute inset-0 z-10 w-full h-full"> 1288 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1289 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1290 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1291 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-m/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1292 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1293 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1294 <img src="https://camperandnicholsons.com/IMAGE/947466/h-ml-l/camperandnicholsons-_a_c&n_947466h-ml-l.webp" class="" alt="" loading='lazy' > 1295 </picture> 1296 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1297 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1298 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-m/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1299 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 1300 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp">
1301 <img src="https://camperandnicholsons.com/IMAGE/947466/h-ml-l/camperandnicholsons-_a_c&n_947466h-ml-l.webp" class="" alt="" loading='lazy' > 1302 </picture> 1303 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1304 <div class="mt-auto"> 1305 <h3 class="h10 all-caps mb-[10px]">Destinations</h3> 1306 <a href="/charter-a-yacht/destinations" class="h18 box-link">Explore the World</a> 1307 </div> 1308 </div> 1309 </div> 1310 </div> 1311 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1312 <div class="absolute inset-0 z-10 w-full h-full"> 1313 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1314 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1315 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1316 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-m/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1317 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1318 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1319 <img src="https://camperandnicholsons.com/IMAGE/947465/h-ml-l/camperandnicholsons-_a_c&n_947465h-ml-l.webp" class="" alt="" loading='lazy' > 1320 </picture> 1321 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1322 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1323 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-m/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1324 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1325 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 1326 <img src="https://camperandnicholsons.com/IMAGE/947465/h-ml-l/camperandnicholsons-_a_c&n_947465h-ml-l.webp" class="" alt="" loading='lazy' > 1327 </picture> 1328 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1329 <div class="mt-auto"> 1330 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 1331 <a href="/charter-a-yacht/yachts-for-charter" class="h18 box-link">Yacht for Charter</a> 1332 </div> 1333 </div> 1334 </div> 1335 </div> 1336 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1337 <div class="absolute inset-0 z-10 w-full h-full"> 1338 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1339 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1340 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1341 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-m/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1342 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1343 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
1343com/IMAGE/947468/h-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1344 <img src="https://camperandnicholsons.com/IMAGE/947468/h-ml-l/camperandnicholsons-_a_c&n_947468h-ml-l.webp" class="" alt="" loading='lazy' > 1345 </picture> 1346 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1347 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1348 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-m/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1349 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1350 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 1351 <img src="https://camperandnicholsons.com/IMAGE/947468/h-ml-l/camperandnicholsons-_a_c&n_947468h-ml-l.webp" class="" alt="" loading='lazy' > 1352 </picture> 1353 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1354 <div class="mt-auto"> 1355 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1356 <a href="/charter-a-yacht" class="h18 box-link">Yacht Charter</a> 1357 </div> 1358 </div> 1359 </div> 1360 </div> 1361 </div> 1362 </div> 1363 </div> 1364 <div x-show="mobileSelectedNav === 1" class="flex flex-col s:flex-row h-full"> 1365 <!-- Submenu links column --> 1366 <div class="s:w-1/2 s:pr-[20px]"> 1367 <ul class="px-[20px] mb-[30px]"> 1368 <li class="mb-[8px] js-mobile-submenu-item"> 1369 <a href="/buy-a-yacht" class="body-16 text-black py-[8px] inline-block"> 1370 Buying a Yacht </a> 1371 </li> 1372 <li class="mb-[8px] js-mobile-submenu-item"> 1373 <a href="/buy-a-yacht/yachts-for-sale" class="body-16 text-black py-[8px] inline-block"> 1374 Yachts for Sale </a> 1375 </li> 1376 <li class="mb-[8px] js-mobile-submenu-item"> 1377 <a href="/buy-a-yacht/yachts-for-sale/new-build-yachts" class="body-16 text-black py-[8px] inline-block"> 1378 New Build Yachts </a> 1379 </li> 1380 </ul> 1381 1382 <ul class="px-[20px] pt-[20px] border-t border-black/10"> 1383 <li class="mb-[8px] js-mobile-submenu-item"> 1384 <a href="/buy-a-yacht/frequently-asked-questions" class="body-14 text-black py-[8px] inline-block"> 1385 Frequent Questions </a> 1386 </li> 1387 <li class="mb-[8px] js-mobile-submenu-item"> 1388 <a href="/buy-a-yacht/sales-team" class="body-14 text-black py-[8px] inline-block"> 1389 Yacht Sales Team </a> 1390 </li> 1391 </ul> 1392 </div> 1393 1394 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1395 <div class="block flex-1 s:w-1/2"> 1396 <div class="block gap-0 mt-[40px] s:mt-0"> 1397 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1398 <div class="absolute inset-0 z-10 w-full h-full"> 1399 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1400 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1401 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1401com/IMAGE/947462/s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1402 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-m/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1403 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1404 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1405 <img src="https://camperandnicholsons.com/IMAGE/947462/h-ml-l/camperandnicholsons-_a_c&n_947462h-ml-l.webp" class="" alt="" loading='lazy' > 1406 </picture> 1407 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1408 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1409 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-m/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1410 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1411 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 1412 <img src="https://camperandnicholsons.com/IMAGE/947462/h-ml-l/camperandnicholsons-_a_c&n_947462h-ml-l.webp" class="" alt="" loading='lazy' > 1413 </picture> 1414 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1415 <div class="mt-auto"> 1416 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 1417 <a href="/buy-a-yacht/yachts-for-sale/motor-yachts" class="h18 box-link">Motor Yachts</a> 1418 </div> 1419 </div> 1420 </div> 1421 </div> 1422 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1423 <div class="absolute inset-0 z-10 w-full h-full"> 1424 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1425 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1426 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1427 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-m/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1428 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1429 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1430 <img src="https://camperandnicholsons.com/IMAGE/947464/h-ml-l/camperandnicholsons-_a_c&n_947464h-ml-l.webp" class="" alt="" loading='lazy' > 1431 </picture> 1432 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1433 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1434 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-m/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1435 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 1436 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp">
1437 <img src="https://camperandnicholsons.com/IMAGE/947464/h-ml-l/camperandnicholsons-_a_c&n_947464h-ml-l.webp" class="" alt="" loading='lazy' > 1438 </picture> 1439 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1440 <div class="mt-auto"> 1441 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 1442 <a href="/buy-a-yacht/yachts-for-sale/sailing-yachts" class="h18 box-link">Sailing Yachts</a> 1443 </div> 1444 </div> 1445 </div> 1446 </div> 1447 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1448 <div class="absolute inset-0 z-10 w-full h-full"> 1449 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1450 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1451 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1452 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-m/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1453 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1454 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1455 <img src="https://camperandnicholsons.com/IMAGE/947461/h-ml-l/camperandnicholsons-_a_c&n_947461h-ml-l.webp" class="" alt="" loading='lazy' > 1456 </picture> 1457 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1458 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1459 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-m/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1460 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1461 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 1462 <img src="https://camperandnicholsons.com/IMAGE/947461/h-ml-l/camperandnicholsons-_a_c&n_947461h-ml-l.webp" class="" alt="" loading='lazy' > 1463 </picture> 1464 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1465 <div class="mt-auto"> 1466 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 1467 <a href="/buy-a-yacht/yachts-for-sale/new-build-yachts" class="h18 box-link">New Build Yachts</a> 1468 </div> 1469 </div> 1470 </div> 1471 </div> 1472 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1473 <div class="absolute inset-0 z-10 w-full h-full"> 1474 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1475 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1476 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1477 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-m/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1478 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1479 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
1479com/IMAGE/947463/h-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1480 <img src="https://camperandnicholsons.com/IMAGE/947463/h-ml-l/camperandnicholsons-_a_c&n_947463h-ml-l.webp" class="" alt="" loading='lazy' > 1481 </picture> 1482 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1483 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1484 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-m/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1485 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1486 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 1487 <img src="https://camperandnicholsons.com/IMAGE/947463/h-ml-l/camperandnicholsons-_a_c&n_947463h-ml-l.webp" class="" alt="" loading='lazy' > 1488 </picture> 1489 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1490 <div class="mt-auto"> 1491 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 1492 <a href="/buy-a-yacht/yachts-for-sale" class="h18 box-link">All Yachts for Sale</a> 1493 </div> 1494 </div> 1495 </div> 1496 </div> 1497 </div> 1498 </div> 1499 </div> 1500 <div x-show="mobileSelectedNav === 2" class="flex flex-col s:flex-row h-full"> 1501 <!-- Submenu links column --> 1502 <div class="s:w-1/2 s:pr-[20px]"> 1503 <ul class="px-[20px] mb-[30px]"> 1504 <li class="mb-[8px] js-mobile-submenu-item"> 1505 <a href="/sell-a-yacht" class="body-16 text-black py-[8px] inline-block"> 1506 Selling a Yacht </a> 1507 </li> 1508 <li class="mb-[8px] js-mobile-submenu-item"> 1509 <a href="/sell-a-yacht/yachts-sold" class="body-16 text-black py-[8px] inline-block"> 1510 Yachts Sold </a> 1511 </li> 1512 <li class="mb-[8px] js-mobile-submenu-item"> 1513 <a href="/owner-services/yacht-marketing" class="body-16 text-black py-[8px] inline-block"> 1514 Yacht Marketing </a> 1515 </li> 1516 </ul> 1517 1518 <ul class="px-[20px] pt-[20px] border-t border-black/10"> 1519 <li class="mb-[8px] js-mobile-submenu-item"> 1520 <a href="/sell-a-yacht/list-a-yacht" class="body-14 text-black py-[8px] inline-block"> 1521 List a Yacht for Sale </a> 1522 </li> 1523 <li class="mb-[8px] js-mobile-submenu-item"> 1524 <a href="/sell-a-yacht/frequently-asked-questions" class="body-14 text-black py-[8px] inline-block"> 1525 Frequent Questions </a> 1526 </li> 1527 <li class="mb-[8px] js-mobile-submenu-item"> 1528 <a href="/sell-a-yacht/sales-team" class="body-14 text-black py-[8px] inline-block"> 1529 Yacht Sales Team </a> 1530 </li> 1531 </ul> 1532 </div> 1533 1534 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1535 <div class="block flex-1 s:w-1/2"> 1536 <div class="block gap-0 mt-[40px] s:mt-0"> 1537 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1538 <div class="absolute inset-0 z-10 w-full h-full"> 1539 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1540 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1541 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1541com/IMAGE/947460/s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1542 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-m/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1543 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1544 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1545 <img src="https://camperandnicholsons.com/IMAGE/947460/h-ml-l/camperandnicholsons-_a_c&n_947460h-ml-l.webp" class="" alt="" loading='lazy' > 1546 </picture> 1547 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1548 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1549 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-m/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1550 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1551 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 1552 <img src="https://camperandnicholsons.com/IMAGE/947460/h-ml-l/camperandnicholsons-_a_c&n_947460h-ml-l.webp" class="" alt="" loading='lazy' > 1553 </picture> 1554 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1555 <div class="mt-auto"> 1556 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1557 <a href="/sell-a-yacht" class="h18 box-link">Yacht Sales</a> 1558 </div> 1559 </div> 1560 </div> 1561 </div> 1562 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1563 <div class="absolute inset-0 z-10 w-full h-full"> 1564 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1565 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1566 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1567 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-m/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1568 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1569 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1570 <img src="https://camperandnicholsons.com/IMAGE/947458/h-ml-l/camperandnicholsons-_a_c&n_947458h-ml-l.webp" class="" alt="" loading='lazy' > 1571 </picture> 1572 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1573 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1574 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-m/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1575 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1576 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 1577 <img src="https://camperandnicholsons.com/IMAGE/947458/h-ml-l/camperandnicholsons-_a_c&n_947458h-ml-l.webp" class="" alt="" loading='lazy' > 1578 </picture> 1579 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1580 <div class="mt-auto"> 1581 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1582 <a href="/owner-services/yacht-marketing" class="h18 box-link">Yacht Marketing</a> 1583 </div> 1584 </div> 1585 </div> 1586 </div> 1587 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1588 <div class="absolute inset-0 z-10 w-full h-full"> 1589 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1590 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1591 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1591com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1592 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1593 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1594 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1595 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 1596 </picture> 1597 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1598 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1599 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1600 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1601 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 1602 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 1603 </picture> 1604 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1605 <div class="mt-auto"> 1606 <h3 class="h10 all-caps mb-[10px]">About</h3> 1607 <a href="/team" class="h18 box-link">The Team</a> 1608 </div> 1609 </div> 1610 </div> 1611 </div> 1612 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1613 <div class="absolute inset-0 z-10 w-full h-full"> 1614 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1615 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1616 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1617 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-m/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1618 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1619 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1620 <img src="https://camperandnicholsons.com/IMAGE/947459/h-ml-l/camperandnicholsons-_a_c&n_947459h-ml-l.webp" class="" alt="" loading='lazy' > 1621 </picture> 1622 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1623 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1624 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-m/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1625 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1626 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 1627 <img src="https://camperandnicholsons.com/IMAGE/947459/h-ml-l/camperandnicholsons-_a_c&n_947459h-ml-l.webp" class="" alt="" loading='lazy' > 1628 </picture> 1629 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1630 <div class="mt-auto"> 1631 <h3 class="h10 all-caps mb-[10px]">Contact</h3> 1632 <a href="/sell-a-yacht/list-a-yacht" class="h18 box-link">List a Yacht</a> 1633 </div> 1634 </div> 1635 </div> 1636 </div> 1637 </div> 1638 </div> 1639 </div> 1640 <div x-show="mobileSelectedNav === 3" class="flex flex-col s:flex-row h-full"> 1641 <!-- Submenu links column --> 1642 <div class="s:w-1/2 s:pr-[20px]"> 1643 <ul class="px-[20px] mb-[30px]"> 1644 <li class="mb-[8px] js-mobile-submenu-item"> 1645 <a href="/build-a-yacht" class="body-16 text-black py-[8px] inline-block"> 1646 Building a Yacht </a> 1647 </li> 1648 <li class="mb-[8px] js-mobile-submenu-item"> 1649 <a href="/build-a-yacht/new-build-sales" class="body-16 text-black py-[8px] inline-block"> 1650 New Build S
1650ales </a> 1651 </li> 1652 <li class="mb-[8px] js-mobile-submenu-item"> 1653 <a href="/build-a-yacht/project-coordination" class="body-16 text-black py-[8px] inline-block"> 1654 Project Coordination </a> 1655 </li> 1656 <li class="mb-[8px] js-mobile-submenu-item"> 1657 <a href="/build-a-yacht/yacht-refit" class="body-16 text-black py-[8px] inline-block"> 1658 Yacht Refit </a> 1659 </li> 1660 <li class="mb-[8px] js-mobile-submenu-item"> 1661 <a href="/design-studio" class="body-16 text-black py-[8px] inline-block"> 1662 Design </a> 1663 </li> 1664 </ul> 1665 1666 </div> 1667 1668 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1669 <div class="block flex-1 s:w-1/2"> 1670 <div class="block gap-0 mt-[40px] s:mt-0"> 1671 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1672 <div class="absolute inset-0 z-10 w-full h-full"> 1673 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1674 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1675 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1676 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-m/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1677 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1678 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1679 <img src="https://camperandnicholsons.com/IMAGE/947456/h-ml-l/camperandnicholsons-_a_c&n_947456h-ml-l.webp" class="" alt="" loading='lazy' > 1680 </picture> 1681 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1682 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1683 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-m/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1684 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 1685 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp">
1686 <img src="https://camperandnicholsons.com/IMAGE/947456/h-ml-l/camperandnicholsons-_a_c&n_947456h-ml-l.webp" class="" alt="" loading='lazy' > 1687 </picture> 1688 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1689 <div class="mt-auto"> 1690 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1691 <a href="/build-a-yacht/new-build-sales" class="h18 box-link">New Build Sales</a> 1692 </div> 1693 </div> 1694 </div> 1695 </div> 1696 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1697 <div class="absolute inset-0 z-10 w-full h-full"> 1698 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1699 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1700 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1701 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-m/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1702 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1703 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1704 <img src="https://camperandnicholsons.com/IMAGE/947455/h-ml-l/camperandnicholsons-_a_c&n_947455h-ml-l.webp" class="" alt="" loading='lazy' > 1705 </picture> 1706 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1707 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1708 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-m/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1709 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1710 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 1711 <img src="https://camperandnicholsons.com/IMAGE/947455/h-ml-l/camperandnicholsons-_a_c&n_947455h-ml-l.webp" class="" alt="" loading='lazy' > 1712 </picture> 1713 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1714 <div class="mt-auto"> 1715 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1716 <a href="/build-a-yacht/project-coordination" class="h18 box-link">Project Coordination</a> 1717 </div> 1718 </div> 1719 </div> 1720 </div> 1721 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1722 <div class="absolute inset-0 z-10 w-full h-full"> 1723 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1724 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1725 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1726 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-m/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1727 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1728 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
1728com/IMAGE/947454/h-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1729 <img src="https://camperandnicholsons.com/IMAGE/947454/h-ml-l/camperandnicholsons-_a_c&n_947454h-ml-l.webp" class="" alt="" loading='lazy' > 1730 </picture> 1731 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1732 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1733 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-m/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1734 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1735 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 1736 <img src="https://camperandnicholsons.com/IMAGE/947454/h-ml-l/camperandnicholsons-_a_c&n_947454h-ml-l.webp" class="" alt="" loading='lazy' > 1737 </picture> 1738 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1739 <div class="mt-auto"> 1740 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1741 <a href="/design-studio" class="h18 box-link">Design Studio</a> 1742 </div> 1743 </div> 1744 </div> 1745 </div> 1746 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1747 <div class="absolute inset-0 z-10 w-full h-full"> 1748 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1749 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1750 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1751 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-m/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1752 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1753 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1754 <img src="https://camperandnicholsons.com/IMAGE/947453/h-ml-l/camperandnicholsons-_a_c&n_947453h-ml-l.webp" class="" alt="" loading='lazy' > 1755 </picture> 1756 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1757 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1758 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-m/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1759 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1760 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 1761 <img src="https://camperandnicholsons.com/IMAGE/947453/h-ml-l/camperandnicholsons-_a_c&n_947453h-ml-l.webp" class="" alt="" loading='lazy' > 1762 </picture> 1763 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1764 <div class="mt-auto"> 1765 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1766 <a href="/build-a-yacht/yacht-refit" class="h18 box-link">Yacht Refit</a> 1767 </div> 1768 </div> 1769 </div> 1770 </div> 1771 </div> 1772 </div> 1773 </div> 1774 <div x-show="mobileSelectedNav === 4" class="flex flex-col s:flex-row h-full"> 1775 <!-- Submenu links column --> 1776 <div class="s:w-1/2 s:pr-[20px]"> 1777 <ul class="px-[20px] mb-[30px]"> 1778 <li class="mb-[8px] js-mobile-submenu-item"> 1779 <a href="/design-studio" class="body-16 text-black py-[8px] inline-block"> 1780 Design Studio </a> 1781 </li> 1782 <li class="mb-[8px] js-mobile-submenu-item"> 1783 <a href="/design-studio/exterior-design" class="body-16 text-black py-[8px] inline-block"> 1784 Exterior Design </a> 1785 </li> 1786 <li class="mb-[8px] js-mobile-submenu-item"> 1787 <a href="/design-studio/interior-design" class="body-16 text-black py-[8px] inline-block"> 1788 Interior Design </a> 1789 </li> 1790 <li class="mb-[8px] js-mobile-submenu-item"> 1791 <a href="/design-studio/design-and-decor" class="body-16 text-black py-[8px] inline-block"> 1792 Design & Décor </a> 1793 </li> 1794 <li class="mb-[8px] js-mobile-submenu-item"> 1795 <a href="/design-studio/canvas" class="body-16 text-black py-[8px] inline-block"> 1796 Canvas by Camper & Nicholsons </a> 1797 </li> 1798 </ul> 1799 1800 </div> 1801 1802 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1803 <div class="block flex-1 s:w-1/2"> 1804 <div class="block gap-0 mt-[40px] s:mt-0"> 1805 </div> 1806 </div> 1807 </div> 1808 <div x-show="mobileSelectedNav === 5" class="flex flex-col s:flex-row h-full"> 1809 <!-- Submenu links column --> 1810 <div class="s:w-1/2 s:pr-[20px]"> 1811 <ul class="px-[20px] mb-[30px]"> 1812 <li class="mb-[8px] js-mobile-submenu-item"> 1813 <a href="/owner-services/yacht-management" class="body-16 text-black py-[8px] inline-block"> 1814 Yacht Management </a> 1815 </li> 1816 <li class="mb-[8px] js-mobile-submenu-item"> 1817 <a href="/owner-services/charter-management" class="body-16 text-black py-[8px] inline-block"> 1818 Charter Management </a> 1819 </li> 1820 <li class="mb-[8px] js-mobile-submenu-item"> 1821 <a href="/owner-services/insurance-solutions" class="body-16 text-black py-[8px] inline-block"> 1822 Insurance solutions </a> 1823 </li> 1824 <li class="mb-[8px] js-mobile-submenu-item"> 1825 <a href="/owner-services/corporate-services" class="body-16 text-black py-[8px] inline-block"> 1826 Corporate Services </a> 1827 </li> 1828 <li class="mb-[8px] js-mobile-submenu-item"> 1829 <a href="/owner-services/crew-services" class="body-16 text-black py-[8px] inline-block"> 1830 Crew Services </a> 1831 </li> 1832 <li class="mb-[8px] js-mobile-submenu-item"> 1833 <a href="/owner-services/Purchasing" class="body-16 text-black py-[8px] inline-block"> 1834 Purchasing </a> 1835 </li> 1836 </ul> 1837 1838 <ul class="px-[20px] pt-[20px] border-t border-black/10"> 1839 <li class="mb-[8px] js-mobile-submenu-item"> 1840 <a href="/sell-a-yacht/list-a-yacht" class="body-14 text-black py-[8px] inline-block"> 1841 List a Yacht for Sale </a> 1842 </li> 1843 <li class="mb-[8px] js-mobile-submenu-item"> 1844 <a href="/owner-services/charter-management/list-a-yacht" class="body-14 text-black py-[8px] inline-block"> 1845 List a Yacht for Charter </a> 1846 </li> 1847 </ul> 1848 </div> 1849 1850 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1851 <div class="block flex-1 s:w-1/2"> 1852 <div class="block gap-0 mt-[40px] s:mt-0"> 1853 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1854 <div class="absolute inset-0 z-10 w-full h-full"> 1855 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1856 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1857 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1857com/IMAGE/947452/s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1858 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-m/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1859 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1860 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1861 <img src="https://camperandnicholsons.com/IMAGE/947452/h-ml-l/camperandnicholsons-_a_c&n_947452h-ml-l.webp" class="" alt="" loading='lazy' > 1862 </picture> 1863 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1864 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1865 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-m/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1866 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1867 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 1868 <img src="https://camperandnicholsons.com/IMAGE/947452/h-ml-l/camperandnicholsons-_a_c&n_947452h-ml-l.webp" class="" alt="" loading='lazy' > 1869 </picture> 1870 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1871 <div class="mt-auto"> 1872 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1873 <a href="/owner-services/yacht-management" class="h18 box-link">Yacht Management</a> 1874 </div> 1875 </div> 1876 </div> 1877 </div> 1878 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1879 <div class="absolute inset-0 z-10 w-full h-full"> 1880 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1881 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1882 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1883 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-m/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1884 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1885 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1886 <img src="https://camperandnicholsons.com/IMAGE/947451/h-ml-l/camperandnicholsons-_a_c&n_947451h-ml-l.webp" class="" alt="" loading='lazy' > 1887 </picture> 1888 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1889 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1890 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-m/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1891 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 1892 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp">
1893 <img src="https://camperandnicholsons.com/IMAGE/947451/h-ml-l/camperandnicholsons-_a_c&n_947451h-ml-l.webp" class="" alt="" loading='lazy' > 1894 </picture> 1895 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1896 <div class="mt-auto"> 1897 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1898 <a href="/owner-services/insurance-solutions" class="h18 box-link">Insurance Solutions</a> 1899 </div> 1900 </div> 1901 </div> 1902 </div> 1903 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1904 <div class="absolute inset-0 z-10 w-full h-full"> 1905 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1906 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1907 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1908 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-m/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1909 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1910 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1911 <img src="https://camperandnicholsons.com/IMAGE/947450/h-ml-l/camperandnicholsons-_a_c&n_947450h-ml-l.webp" class="" alt="" loading='lazy' > 1912 </picture> 1913 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1914 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1915 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-m/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1916 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1917 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 1918 <img src="https://camperandnicholsons.com/IMAGE/947450/h-ml-l/camperandnicholsons-_a_c&n_947450h-ml-l.webp" class="" alt="" loading='lazy' > 1919 </picture> 1920 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1921 <div class="mt-auto"> 1922 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1923 <a href="/owner-services/corporate-services" class="h18 box-link">Corporate Services</a> 1924 </div> 1925 </div> 1926 </div> 1927 </div> 1928 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1929 <div class="absolute inset-0 z-10 w-full h-full"> 1930 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1931 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1932 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1933 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-m/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1934 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1935 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
1935com/IMAGE/947449/h-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1936 <img src="https://camperandnicholsons.com/IMAGE/947449/h-ml-l/camperandnicholsons-_a_c&n_947449h-ml-l.webp" class="" alt="" loading='lazy' > 1937 </picture> 1938 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1939 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1940 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-m/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1941 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1942 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 1943 <img src="https://camperandnicholsons.com/IMAGE/947449/h-ml-l/camperandnicholsons-_a_c&n_947449h-ml-l.webp" class="" alt="" loading='lazy' > 1944 </picture> 1945 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1946 <div class="mt-auto"> 1947 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1948 <a href="/owner-services/charter-management" class="h18 box-link">Charter Management</a> 1949 </div> 1950 </div> 1951 </div> 1952 </div> 1953 </div> 1954 </div> 1955 </div> 1956 <div x-show="mobileSelectedNav === 6" class="flex flex-col s:flex-row h-full"> 1957 <!-- Submenu links column --> 1958 <div class="s:w-1/2 s:pr-[20px]"> 1959 <ul class="px-[20px] mb-[30px]"> 1960 <li class="mb-[8px] js-mobile-submenu-item"> 1961 <a href="/crew-placement" class="body-16 text-black py-[8px] inline-block"> 1962 Work in Yachting </a> 1963 </li> 1964 <li class="mb-[8px] js-mobile-submenu-item"> 1965 <a href="/crew-placement/superyacht-crew-jobs" class="body-16 text-black py-[8px] inline-block"> 1966 Crew Positions </a> 1967 </li> 1968 <li class="mb-[8px] js-mobile-submenu-item"> 1969 <a href="/register" class="body-16 text-black py-[8px] inline-block"> 1970 Register as Crew </a> 1971 </li> 1972 </ul> 1973 1974 </div> 1975 1976 <!-- Cards column - show on mobile below menu, side by side on tablet --> 1977 <div class="block flex-1 s:w-1/2"> 1978 <div class="block gap-0 mt-[40px] s:mt-0"> 1979 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 1980 <div class="absolute inset-0 z-10 w-full h-full"> 1981 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 1982 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 1983 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
1983com/IMAGE/947448/s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1984 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-m/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1985 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1986 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1987 <img src="https://camperandnicholsons.com/IMAGE/947448/h-ml-l/camperandnicholsons-_a_c&n_947448h-ml-l.webp" class="" alt="" loading='lazy' > 1988 </picture> 1989 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 1990 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1991 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-m/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1992 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1993 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 1994 <img src="https://camperandnicholsons.com/IMAGE/947448/h-ml-l/camperandnicholsons-_a_c&n_947448h-ml-l.webp" class="" alt="" loading='lazy' > 1995 </picture> 1996 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 1997 <div class="mt-auto"> 1998 <h3 class="h10 all-caps mb-[10px]">Service</h3> 1999 <a href="/crew-placement" class="h18 box-link">Crew Placement</a> 2000 </div> 2001 </div> 2002 </div> 2003 </div> 2004 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2005 <div class="absolute inset-0 z-10 w-full h-full"> 2006 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2007 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2008 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2009 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-m/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2010 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2011 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2012 <img src="https://camperandnicholsons.com/IMAGE/947447/h-ml-l/camperandnicholsons-_a_c&n_947447h-ml-l.webp" class="" alt="" loading='lazy' > 2013 </picture> 2014 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2015 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2016 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-m/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2017 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2018 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2019 <img src="https://camperandnicholsons.com/IMAGE/947447/h-ml-l/camperandnicholsons-_a_c&n_947447h-ml-l.webp" class="" alt="" loading='lazy' > 2020 </picture> 2021 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2022 <div class="mt-auto"> 2023 <h3 class="h10 all-caps mb-[10px]">Crew Positions</h3> 2024 <a href="/crew-placement/superyacht-crew-jobs" class="h18 box-link">Service</a> 2025 </div> 2026 </div> 2027 </div> 2028 </div> 2029 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2030 <div class="absolute inset-0 z-10 w-full h-full"> 2031 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2032 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2033 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2033com/IMAGE/947446/s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2034 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-m/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2035 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2036 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2037 <img src="https://camperandnicholsons.com/IMAGE/947446/h-ml-l/camperandnicholsons-_a_c&n_947446h-ml-l.webp" class="" alt="" loading='lazy' > 2038 </picture> 2039 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2040 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2041 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-m/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2042 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2043 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2044 <img src="https://camperandnicholsons.com/IMAGE/947446/h-ml-l/camperandnicholsons-_a_c&n_947446h-ml-l.webp" class="" alt="" loading='lazy' > 2045 </picture> 2046 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2047 <div class="mt-auto"> 2048 <h3 class="h10 all-caps mb-[10px]">Register</h3> 2049 <a href="/register" class="h18 box-link">Sign Up Today</a> 2050 </div> 2051 </div> 2052 </div> 2053 </div> 2054 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2055 <div class="absolute inset-0 z-10 w-full h-full"> 2056 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2057 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2058 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2059 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-m/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2060 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2061 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2062 <img src="https://camperandnicholsons.com/IMAGE/947445/h-ml-l/camperandnicholsons-_a_c&n_947445h-ml-l.webp" class="" alt="" loading='lazy' > 2063 </picture> 2064 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2065 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2066 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-m/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2067 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2068 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2069 <img src="https://camperandnicholsons.com/IMAGE/947445/h-ml-l/camperandnicholsons-_a_c&n_947445h-ml-l.webp" class="" alt="" loading='lazy' > 2070 </picture> 2071 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2072 <div class="mt-auto"> 2073 <h3 class="h10 all-caps mb-[10px]">Contact</h3> 2074 <a href="/contact-us" class="h18 box-link">Speak to Our Team</a> 2075 </div> 2076 </div> 2077 </div> 2078 </div> 2079 </div> 2080 </div> 2081 </div> 2082 <div x-show="mobileSelectedNav === 7" class="flex flex-col s:flex-row h-full"> 2083 <!-- Submenu links column --> 2084 <div class="s:w-1/2 s:pr-[20px]"> 2085 <ul class="px-[20px] mb-[30px]"> 2086 <li class="mb-[8px] js-mobile-submenu-item"> 2087 <a href="/the-brand" class="body-16 text-black py-[8px] inline-block"> 2088 Brand </a> 2089 </li> 2090 <li class="mb-[8px] js-mobile-submenu-item"> 2091 <a href="/team" class="body-16 text-black py-[8px] inline-block"> 2092 Team </a> 2093 </li> 2094 <li class="mb-[8px] js-mobile-submenu-item"> 2095 <a href="/office" class="body-16 text-black py-[8px] inline-block"> 2096 Offices </a> 2097 </li> 2098 <li class="mb-[8px] js-mobile-submenu-item"> 2099 <a href="/academy" class="body-16 text-black py-[8px] inline-block"> 2100 Academy </a> 2101 </li> 2102 <li class="mb-[8px] js-mobile-submenu-item"> 2103 <a href="/campaigns" class="body-16 text-black py-[8px] inline-block"> 2104 Campaigns </a> 2105 </li> 2106 <li class="mb-[8px] js-mobile-submenu-item"> 2107 <a href="https://cnrealestate.com" class="body-16 text-black py-[8px] inline-block"> 2108 Real Estate </a> 2109 </li> 2110 </ul> 2111 2112 <ul class="px-[20px] pt-[20px] border-t border-black/10"> 2113 <li class="mb-[8px] js-mobile-submenu-item"> 2114 <a href="/careers" class="body-14 text-black py-[8px] inline-block"> 2115 Careers </a> 2116 </li> 2117 <li class="mb-[8px] js-mobile-submenu-item"> 2118 <a href="/careers/our-job-offers" class="body-14 text-black py-[8px] inline-block"> 2119 Join Us </a> 2120 </li> 2121 </ul> 2122 </div> 2123 2124 <!-- Cards column - show on mobile below menu, side by side on tablet --> 2125 <div class="block flex-1 s:w-1/2"> 2126 <div class="block gap-0 mt-[40px] s:mt-0"> 2127 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2128 <div class="absolute inset-0 z-10 w-full h-full"> 2129 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2130 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2131 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2131com/IMAGE/947444/s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2132 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-m/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2133 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2134 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2135 <img src="https://camperandnicholsons.com/IMAGE/947444/h-ml-l/camperandnicholsons-_a_c&n_947444h-ml-l.webp" class="" alt="" loading='lazy' > 2136 </picture> 2137 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2138 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2139 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-m/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2140 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2141 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2142 <img src="https://camperandnicholsons.com/IMAGE/947444/h-ml-l/camperandnicholsons-_a_c&n_947444h-ml-l.webp" class="" alt="" loading='lazy' > 2143 </picture> 2144 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2145 <div class="mt-auto"> 2146 <h3 class="h10 all-caps mb-[10px]">About</h3> 2147 <a href="/the-brand" class="h18 box-link">The Brand</a> 2148 </div> 2149 </div> 2150 </div> 2151 </div> 2152 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2153 <div class="absolute inset-0 z-10 w-full h-full"> 2154 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2155 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2156 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2157 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-m/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2158 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2159 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2160 <img src="https://camperandnicholsons.com/IMAGE/947443/h-ml-l/camperandnicholsons-_a_c&n_947443h-ml-l.webp" class="" alt="" loading='lazy' > 2161 </picture> 2162 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2163 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2164 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-m/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2165 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2166 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2167 <img src="https://camperandnicholsons.com/IMAGE/947443/h-ml-l/camperandnicholsons-_a_c&n_947443h-ml-l.webp" class="" alt="" loading='lazy' > 2168 </picture> 2169 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2170 <div class="mt-auto"> 2171 <h3 class="h10 all-caps mb-[10px]">About</h3> 2172 <a href="/office" class="h18 box-link">The Locations</a> 2173 </div> 2174 </div> 2175 </div> 2176 </div> 2177 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2178 <div class="absolute inset-0 z-10 w-full h-full"> 2179 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2180 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2181 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2181com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2182 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2183 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2184 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2185 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 2186 </picture> 2187 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2188 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2189 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2190 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2191 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2192 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 2193 </picture> 2194 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2195 <div class="mt-auto"> 2196 <h3 class="h10 all-caps mb-[10px]">About</h3> 2197 <a href="/team" class="h18 box-link">The Team</a> 2198 </div> 2199 </div> 2200 </div> 2201 </div> 2202 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2203 <div class="absolute inset-0 z-10 w-full h-full"> 2204 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2205 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2206 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2207 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-m/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2208 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2209 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2210 <img src="https://camperandnicholsons.com/IMAGE/947441/h-ml-l/camperandnicholsons-_a_c&n_947441h-ml-l.webp" class="" alt="" loading='lazy' > 2211 </picture> 2212 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2213 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2214 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-m/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2215 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2216 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 2217 <img src="https://camperandnicholsons.com/IMAGE/947441/h-ml-l/camperandnicholsons-_a_c&n_947441h-ml-l.webp" class="" alt="" loading='lazy' > 2218 </picture> 2219 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2220 <div class="mt-auto"> 2221 <h3 class="h10 all-caps mb-[10px]">About</h3> 2222 <a href="/academy" class="h18 box-link">The Academy</a> 2223 </div> 2224 </div> 2225 </div> 2226 </div> 2227 </div> 2228 </div> 2229 </div> 2230 <div x-show="mobileSelectedNav === 8" class="flex flex-col s:flex-row h-full"> 2231 <!-- Submenu links column --> 2232 <div class="s:w-1/2 s:pr-[20px]"> 2233 2234 </div> 2235 2236 <!-- Cards column - show on mobile below menu, side by side on tablet --> 2237 <div class="block flex-1 s:w-1/2"> 2238 <div class="block gap-0 mt-[40px] s:mt-0"> 2239 </div> 2240 </div> 2241 </div> 2242 </div> 2243 </div> 2244 </div> 2245 </div> 2246 2247 <!-- Mega Menu Bottom Bar - Currency Switcher --> 2248 <div 2249 class="js-mega-menu-bottom-bar flex-shrink-0 z-30 border-t border-black/10 pb-[env(safe-area-inset-bottom)] hidden" 2250 @click.away="currencyOpen = false" 2251 :class="{ 'glass-fx': currencyOpen }" 2252 > 2253 <!-- Currency Dropdown --> 2254 <div class="relative w-full"> 2255 <button 2256 @click="currencyOpen = !currencyOpen" 2257 class="w-full flex items-center justify-between gap-[8px] h-[40p
2257x] s:h-[60px] px-[20px] 2xl:px-[40px] h10 s:body-12 font-medium text-black transition-all" 2258 > 2259 <span class="all-caps" x-text="$store.currency.getSelectedLabel()">Currency</span> 2260 <svg 2261 class="w-[12px] h-[12px] transition-transform flex-shrink-0" 2262 :class="{ 'rotate-180': currencyOpen }" 2263 width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" 2264 > 2265 <path d="M9.59941 4.20004L5.99862 8.30349L2.39941 4.20004" stroke="currentColor" stroke-miterlimit="10" /> 2266 </svg> 2267 </button> 2268 2269 <!-- Dropdown Options --> 2270 <div 2271 x-show="currencyOpen" 2272 x-cloak 2273 x-transition:enter="transition ease-out duration-150" 2274 x-transition:enter-start="opacity-0 translate-y-2" 2275 x-transition:enter-end="opacity-100 translate-y-0" 2276 x-transition:leave="transition ease-in duration-100" 2277 x-transition:leave-start="opacity-100 translate-y-0" 2278 x-transition:leave-end="opacity-0 translate-y-2" 2279 class="absolute bottom-full left-0 right-0 glass-fx overflow-hidden py-[8px]" 2280 > 2281 <template x-for="currency in $store.currency.currencies" :key="currency.code"> 2282 <button 2283 @click="$store.currency.selected = currency.code; currencyOpen = false" 2284 class="group w-full flex items-center justify-between px-[24px] py-[16px] body-14 font-medium all-caps text-black" 2285 > 2286 <span class="relative flex items-center"> 2287 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[12px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 2288 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]" x-text="currency.label"></span> 2289 </span> 2290 <span x-show="$store.currency.selected === currency.code"> <svg class="w-[12px] h-[12px]" aria-hidden="true" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> 2291 <path d="M1 6.32941L4.32941 9.65882L11 3" stroke="currentColor" stroke-linecap="square" stroke-linejoin="round" /> 2292 </svg> 2293</span> 2294 </button> 2295 </template> 2296 </div> 2297 </div> 2298 </div> 2299 2300 2301 <!-- Desktop: Show media/cards --> 2302 <div id="mediaCards" class="relative overflow-hidden flex-1 hidden s:block"> 2303 <div class="absolute inset-0 overflow-hidden"> 2304 <div class="js-mega-menu-overlay-right absolute inset-0 z-10 w-full h-full bg-black -translate-x-full"></div> 2305 </div> 2306 <!-- Default media view when mega menu opens --> 2307 <div class="js-mega-menu-media absolute inset-0 w-full h-full z-20" x-show="activeNav === null" x-cloak> 2308 <!-- Standard video with integrated controls --> 2309 <div x-data="{playing: false}" class="relative h-full"> 2310 <video 2311 x-ref="video" 2312 class="w-full h-full object-cover w-full h-full object-cover" 2313 muted preload="none" loop playsinline 2314 webkit-playsinline"> 2315 <source src="https://camperandnicholsons.com/VIDEO/978667/camperandnicholsons-_a_c&n_978667.mp4" type="video/mp4"> 2316 ?> 2317 Your browser does not support the video tag. 2318 </video> 2319 <div class="absolute z-20 w-[40px] h-[40px] bottom-[20px] right-[20px]"> 2320 <button 2321 type="button" 2322 class="flex w-full h-full items-center justify-center text-white disable-magnetic" 2323 @click="playing ? ($refs.video.pause(), playing = false) : ($refs.video.play(), playing = true)">
2324 <span x-cloak class="block" x-show="!playing" aria-label="Play"> 2325 <svg class="" aria-hidden="true" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 2326 <path d="M14.0217 9.32992L5.61648 14.9333C5.43426 15.0548 5.18807 15.0056 5.06659 14.8234C5.02317 14.7582 5 14.6817 5 14.6034V3.39652C5 3.17752 5.17753 3 5.39652 3C5.47481 3 5.55134 3.02317 5.61648 3.06659L14.0217 8.67002C14.2039 8.79152 14.2531 9.03776 14.1316 9.21992C14.1026 9.26346 14.0652 9.30089 14.0217 9.32992Z" fill="currentColor" /> 2327 </svg> 2328 </span> 2329 <span class="block" x-show="playing" aria-label="Pause"> 2330 <svg class="" aria-hidden="true" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 2331 <path d="M11.25 4.75001C11.25 4.61194 11.3618 4.50002 11.4999 4.50001C11.6326 4.50001 11.8079 4.5 12 4.5C12.1921 4.5 12.3674 4.50001 12.5001 4.50002C12.6382 4.50003 12.75 4.61195 12.75 4.75001V13.25C12.75 13.3881 12.6381 13.5 12.5001 13.5C12.3674 13.5 12.1921 13.5 12 13.5C11.8079 13.5 11.6326 13.5 11.4999 13.5C11.3619 13.5 11.25 13.3881 11.25 13.25V4.75001ZM5.25 4.75001C5.25 4.61194 5.36184 4.50002 5.4999 4.50001C5.6326 4.50001 5.80787 4.5 6 4.5C6.19213 4.5 6.3674 4.50001 6.5001 4.50001C6.63816 4.50002 6.75 4.61194 6.75 4.75001V13.25C6.75 13.3881 6.63815 13.5 6.50008 13.5C6.36738 13.5 6.19212 13.5 6 13.5C5.80788 13.5 5.63262 13.5 5.49992 13.5C5.36185 13.5 5.25 13.3881 5.25 13.25V4.75001Z" fill="currentColor" /> 2332 </svg> 2333 </span> 2334 </button> 2335 </div> 2336 </div> 2337 </div> 2338 <!-- Cards grid shown when a nav item is selected --> 2339 <div class="js-mega-menu-cards absolute inset-0 w-full h-full z-20" x-show="activeNav !== null" x-cloak> 2340 <!-- Charter cards (index 0) --> 2341 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="0"> 2342 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2343 <div class="absolute inset-0 z-10 w-full h-full"> 2344 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2345 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2346 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2347 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-m/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2348 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2349 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2350 <img src="https://camperandnicholsons.com/IMAGE/947467/h-ml-l/camperandnicholsons-_a_c&n_947467h-ml-l.webp" class="" alt="" loading='lazy' > 2351 </picture> 2352 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2353 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2354 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947467/s-m/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2355 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947467/h-s-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2356 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
2356com/IMAGE/947467/h-s/camperandnicholsons-_a_c&n_947467h-ml-l.webp"> 2357 <img src="https://camperandnicholsons.com/IMAGE/947467/h-ml-l/camperandnicholsons-_a_c&n_947467h-ml-l.webp" class="" alt="" loading='lazy' > 2358 </picture> 2359 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2360 <div class="mt-auto"> 2361 <h3 class="h10 all-caps mb-[10px]">Summer 2026</h3> 2362 <a href="/charter-a-yacht/summer-2026" class="h18 box-link">The Art of Living</a> 2363 </div> 2364 </div> 2365 </div> 2366 </div> 2367 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2368 <div class="absolute inset-0 z-10 w-full h-full"> 2369 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2370 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2371 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2372 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-m/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2373 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2374 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2375 <img src="https://camperandnicholsons.com/IMAGE/947466/h-ml-l/camperandnicholsons-_a_c&n_947466h-ml-l.webp" class="" alt="" loading='lazy' > 2376 </picture> 2377 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2378 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2379 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947466/s-m/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2380 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2381 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947466/h-s/camperandnicholsons-_a_c&n_947466h-ml-l.webp"> 2382 <img src="https://camperandnicholsons.com/IMAGE/947466/h-ml-l/camperandnicholsons-_a_c&n_947466h-ml-l.webp" class="" alt="" loading='lazy' > 2383 </picture> 2384 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2385 <div class="mt-auto"> 2386 <h3 class="h10 all-caps mb-[10px]">Destinations</h3> 2387 <a href="/charter-a-yacht/destinations" class="h18 box-link">Explore the World</a> 2388 </div> 2389 </div> 2390 </div> 2391 </div> 2392 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2393 <div class="absolute inset-0 z-10 w-full h-full"> 2394 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2395 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2396 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2397 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-m/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2398 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.
2398com/IMAGE/947465/h-s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2399 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2400 <img src="https://camperandnicholsons.com/IMAGE/947465/h-ml-l/camperandnicholsons-_a_c&n_947465h-ml-l.webp" class="" alt="" loading='lazy' > 2401 </picture> 2402 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2403 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2404 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947465/s-m/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2405 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2406 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947465/h-s/camperandnicholsons-_a_c&n_947465h-ml-l.webp"> 2407 <img src="https://camperandnicholsons.com/IMAGE/947465/h-ml-l/camperandnicholsons-_a_c&n_947465h-ml-l.webp" class="" alt="" loading='lazy' > 2408 </picture> 2409 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2410 <div class="mt-auto"> 2411 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 2412 <a href="/charter-a-yacht/yachts-for-charter" class="h18 box-link">Yacht for Charter</a> 2413 </div> 2414 </div> 2415 </div> 2416 </div> 2417 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2418 <div class="absolute inset-0 z-10 w-full h-full"> 2419 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2420 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2421 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2422 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-m/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2423 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2424 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2425 <img src="https://camperandnicholsons.com/IMAGE/947468/h-ml-l/camperandnicholsons-_a_c&n_947468h-ml-l.webp" class="" alt="" loading='lazy' > 2426 </picture> 2427 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2428 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2429 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947468/s-m/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2430 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2431 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947468/h-s/camperandnicholsons-_a_c&n_947468h-ml-l.webp"> 2432 <img src="https://camperandnicholsons.com/IMAGE/947468/h-ml-l/camperandnicholsons-_a_c&n_947468h-ml-l.webp" class="" alt="" loading='lazy' > 2433 </picture> 2434 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2435 <div class="mt-auto"> 2436 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2437 <a href="/charter-a-yacht" class="h18 box-link">Yacht Charter</a> 2438 </div> 2439 </div> 2440 </div> 2441 </div> 2442 </div> 2443 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="1"> 2444 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2445 <div class="absolute inset-0 z-10 w-full h-full"> 2446 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2447 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2448 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2448com/IMAGE/947462/s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2449 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-m/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2450 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2451 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2452 <img src="https://camperandnicholsons.com/IMAGE/947462/h-ml-l/camperandnicholsons-_a_c&n_947462h-ml-l.webp" class="" alt="" loading='lazy' > 2453 </picture> 2454 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2455 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2456 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947462/s-m/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2457 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2458 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947462/h-s/camperandnicholsons-_a_c&n_947462h-ml-l.webp"> 2459 <img src="https://camperandnicholsons.com/IMAGE/947462/h-ml-l/camperandnicholsons-_a_c&n_947462h-ml-l.webp" class="" alt="" loading='lazy' > 2460 </picture> 2461 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2462 <div class="mt-auto"> 2463 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 2464 <a href="/buy-a-yacht/yachts-for-sale/motor-yachts" class="h18 box-link">Motor Yachts</a> 2465 </div> 2466 </div> 2467 </div> 2468 </div> 2469 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2470 <div class="absolute inset-0 z-10 w-full h-full"> 2471 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2472 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2473 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2474 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-m/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2475 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2476 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2477 <img src="https://camperandnicholsons.com/IMAGE/947464/h-ml-l/camperandnicholsons-_a_c&n_947464h-ml-l.webp" class="" alt="" loading='lazy' > 2478 </picture> 2479 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2480 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2481 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947464/s-m/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2482 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp"> 2483 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947464/h-s/camperandnicholsons-_a_c&n_947464h-ml-l.webp">
2484 <img src="https://camperandnicholsons.com/IMAGE/947464/h-ml-l/camperandnicholsons-_a_c&n_947464h-ml-l.webp" class="" alt="" loading='lazy' > 2485 </picture> 2486 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2487 <div class="mt-auto"> 2488 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 2489 <a href="/buy-a-yacht/yachts-for-sale/sailing-yachts" class="h18 box-link">Sailing Yachts</a> 2490 </div> 2491 </div> 2492 </div> 2493 </div> 2494 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2495 <div class="absolute inset-0 z-10 w-full h-full"> 2496 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2497 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2498 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2499 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-m/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2500 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2501 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2502 <img src="https://camperandnicholsons.com/IMAGE/947461/h-ml-l/camperandnicholsons-_a_c&n_947461h-ml-l.webp" class="" alt="" loading='lazy' > 2503 </picture> 2504 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2505 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2506 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947461/s-m/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2507 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2508 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947461/h-s/camperandnicholsons-_a_c&n_947461h-ml-l.webp"> 2509 <img src="https://camperandnicholsons.com/IMAGE/947461/h-ml-l/camperandnicholsons-_a_c&n_947461h-ml-l.webp" class="" alt="" loading='lazy' > 2510 </picture> 2511 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2512 <div class="mt-auto"> 2513 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 2514 <a href="/buy-a-yacht/yachts-for-sale/new-build-yachts" class="h18 box-link">New Build Yachts</a> 2515 </div> 2516 </div> 2517 </div> 2518 </div> 2519 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2520 <div class="absolute inset-0 z-10 w-full h-full"> 2521 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2522 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2523 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2524 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-m/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2525 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2526 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
2526com/IMAGE/947463/h-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2527 <img src="https://camperandnicholsons.com/IMAGE/947463/h-ml-l/camperandnicholsons-_a_c&n_947463h-ml-l.webp" class="" alt="" loading='lazy' > 2528 </picture> 2529 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2530 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2531 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947463/s-m/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2532 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2533 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947463/h-s/camperandnicholsons-_a_c&n_947463h-ml-l.webp"> 2534 <img src="https://camperandnicholsons.com/IMAGE/947463/h-ml-l/camperandnicholsons-_a_c&n_947463h-ml-l.webp" class="" alt="" loading='lazy' > 2535 </picture> 2536 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2537 <div class="mt-auto"> 2538 <h3 class="h10 all-caps mb-[10px]">Collection</h3> 2539 <a href="/buy-a-yacht/yachts-for-sale" class="h18 box-link">All Yachts for Sale</a> 2540 </div> 2541 </div> 2542 </div> 2543 </div> 2544 </div> 2545 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="2"> 2546 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2547 <div class="absolute inset-0 z-10 w-full h-full"> 2548 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2549 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2550 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2551 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-m/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2552 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2553 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2554 <img src="https://camperandnicholsons.com/IMAGE/947460/h-ml-l/camperandnicholsons-_a_c&n_947460h-ml-l.webp" class="" alt="" loading='lazy' > 2555 </picture> 2556 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2557 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2558 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947460/s-m/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2559 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2560 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947460/h-s/camperandnicholsons-_a_c&n_947460h-ml-l.webp"> 2561 <img src="https://camperandnicholsons.com/IMAGE/947460/h-ml-l/camperandnicholsons-_a_c&n_947460h-ml-l.webp" class="" alt="" loading='lazy' > 2562 </picture> 2563 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2564 <div class="mt-auto"> 2565 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2566 <a href="/sell-a-yacht" class="h18 box-link">Yacht Sales</a> 2567 </div> 2568 </div> 2569 </div> 2570 </div> 2571 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2572 <div class="absolute inset-0 z-10 w-full h-full"> 2573 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2574 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2575 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2575com/IMAGE/947458/s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2576 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-m/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2577 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2578 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2579 <img src="https://camperandnicholsons.com/IMAGE/947458/h-ml-l/camperandnicholsons-_a_c&n_947458h-ml-l.webp" class="" alt="" loading='lazy' > 2580 </picture> 2581 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2582 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2583 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947458/s-m/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2584 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2585 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947458/h-s/camperandnicholsons-_a_c&n_947458h-ml-l.webp"> 2586 <img src="https://camperandnicholsons.com/IMAGE/947458/h-ml-l/camperandnicholsons-_a_c&n_947458h-ml-l.webp" class="" alt="" loading='lazy' > 2587 </picture> 2588 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2589 <div class="mt-auto"> 2590 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2591 <a href="/owner-services/yacht-marketing" class="h18 box-link">Yacht Marketing</a> 2592 </div> 2593 </div> 2594 </div> 2595 </div> 2596 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2597 <div class="absolute inset-0 z-10 w-full h-full"> 2598 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2599 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2600 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2601 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2602 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2603 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2604 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 2605 </picture> 2606 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2607 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2608 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2609 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 2610 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp">
2611 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 2612 </picture> 2613 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2614 <div class="mt-auto"> 2615 <h3 class="h10 all-caps mb-[10px]">About</h3> 2616 <a href="/team" class="h18 box-link">The Team</a> 2617 </div> 2618 </div> 2619 </div> 2620 </div> 2621 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2622 <div class="absolute inset-0 z-10 w-full h-full"> 2623 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2624 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2625 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2626 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-m/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2627 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2628 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2629 <img src="https://camperandnicholsons.com/IMAGE/947459/h-ml-l/camperandnicholsons-_a_c&n_947459h-ml-l.webp" class="" alt="" loading='lazy' > 2630 </picture> 2631 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2632 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2633 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947459/s-m/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2634 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2635 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947459/h-s/camperandnicholsons-_a_c&n_947459h-ml-l.webp"> 2636 <img src="https://camperandnicholsons.com/IMAGE/947459/h-ml-l/camperandnicholsons-_a_c&n_947459h-ml-l.webp" class="" alt="" loading='lazy' > 2637 </picture> 2638 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2639 <div class="mt-auto"> 2640 <h3 class="h10 all-caps mb-[10px]">Contact</h3> 2641 <a href="/sell-a-yacht/list-a-yacht" class="h18 box-link">List a Yacht</a> 2642 </div> 2643 </div> 2644 </div> 2645 </div> 2646 </div> 2647 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="3"> 2648 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2649 <div class="absolute inset-0 z-10 w-full h-full"> 2650 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2651 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2652 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2653 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-m/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2654 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.
2654com/IMAGE/947456/h-s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2655 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2656 <img src="https://camperandnicholsons.com/IMAGE/947456/h-ml-l/camperandnicholsons-_a_c&n_947456h-ml-l.webp" class="" alt="" loading='lazy' > 2657 </picture> 2658 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2659 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2660 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947456/s-m/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2661 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2662 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947456/h-s/camperandnicholsons-_a_c&n_947456h-ml-l.webp"> 2663 <img src="https://camperandnicholsons.com/IMAGE/947456/h-ml-l/camperandnicholsons-_a_c&n_947456h-ml-l.webp" class="" alt="" loading='lazy' > 2664 </picture> 2665 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2666 <div class="mt-auto"> 2667 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2668 <a href="/build-a-yacht/new-build-sales" class="h18 box-link">
2668New Build Sales</a> 2669 </div> 2670 </div> 2671 </div> 2672 </div> 2673 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2674 <div class="absolute inset-0 z-10 w-full h-full"> 2675 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2676 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2677 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2678 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-m/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2679 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2680 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2681 <img src="https://camperandnicholsons.com/IMAGE/947455/h-ml-l/camperandnicholsons-_a_c&n_947455h-ml-l.webp" class="" alt="" loading='lazy' > 2682 </picture> 2683 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2684 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2685 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947455/s-m/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2686 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2687 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947455/h-s/camperandnicholsons-_a_c&n_947455h-ml-l.webp"> 2688 <img src="https://camperandnicholsons.com/IMAGE/947455/h-ml-l/camperandnicholsons-_a_c&n_947455h-ml-l.webp" class="" alt="" loading='lazy' > 2689 </picture> 2690 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2691 <div class="mt-auto"> 2692 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2693 <a href="/build-a-yacht/project-coordination" class="h18 box-link">Project Coordination</a> 2694 </div> 2695 </div> 2696 </div> 2697 </div> 2698 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2699 <div class="absolute inset-0 z-10 w-full h-full"> 2700 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2701 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2702 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2703 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-m/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2704 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2705 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2706 <img src="https://camperandnicholsons.com/IMAGE/947454/h-ml-l/camperandnicholsons-_a_c&n_947454h-ml-l.webp" class="" alt="" loading='lazy' > 2707 </picture> 2708 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2709 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2709com/IMAGE/947454/s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2710 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947454/s-m/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2711 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2712 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947454/h-s/camperandnicholsons-_a_c&n_947454h-ml-l.webp"> 2713 <img src="https://camperandnicholsons.com/IMAGE/947454/h-ml-l/camperandnicholsons-_a_c&n_947454h-ml-l.webp" class="" alt="" loading='lazy' > 2714 </picture> 2715 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2716 <div class="mt-auto"> 2717 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2718 <a href="/design-studio" class="h18 box-link">Design Studio</a> 2719 </div> 2720 </div> 2721 </div> 2722 </div> 2723 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2724 <div class="absolute inset-0 z-10 w-full h-full"> 2725 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2726 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2727 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2728 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-m/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2729 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2730 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2731 <img src="https://camperandnicholsons.com/IMAGE/947453/h-ml-l/camperandnicholsons-_a_c&n_947453h-ml-l.webp" class="" alt="" loading='lazy' > 2732 </picture> 2733 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2734 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2735 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947453/s-m/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2736 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2737 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947453/h-s/camperandnicholsons-_a_c&n_947453h-ml-l.webp"> 2738 <img src="https://camperandnicholsons.com/IMAGE/947453/h-ml-l/camperandnicholsons-_a_c&n_947453h-ml-l.webp" class="" alt="" loading='lazy' > 2739 </picture> 2740 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2741 <div class="mt-auto"> 2742 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2743 <a href="/build-a-yacht/yacht-refit" class="h18 box-link">Yacht Refit</a> 2744 </div> 2745 </div> 2746 </div> 2747 </div> 2748 </div> 2749 <div class="js-card-grid h-full absolute inset-0" data-nav-index="4"> 2750 <!-- Standard video with integrated controls --> 2751 <video 2752 x-ref="video" 2753 class="w-full h-full object-cover w-full h-full object-cover" 2754 muted preload="none" loop playsinline 2755 webkit-playsinline">
2756 <source src="https://camperandnicholsons.com/VIDEO/944161/camperandnicholsons-design_a_c&n_944161h-l.mp4" type="video/mp4"> 2757 ?> 2758 Your browser does not support the video tag. 2759 </video> 2760 </div> 2761 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="5"> 2762 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2763 <div class="absolute inset-0 z-10 w-full h-full"> 2764 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2765 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2766 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2767 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-m/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2768 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2769 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2770 <img src="https://camperandnicholsons.com/IMAGE/947452/h-ml-l/camperandnicholsons-_a_c&n_947452h-ml-l.webp" class="" alt="" loading='lazy' > 2771 </picture> 2772 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2773 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2774 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947452/s-m/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2775 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2776 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947452/h-s/camperandnicholsons-_a_c&n_947452h-ml-l.webp"> 2777 <img src="https://camperandnicholsons.com/IMAGE/947452/h-ml-l/camperandnicholsons-_a_c&n_947452h-ml-l.webp" class="" alt="" loading='lazy' > 2778 </picture> 2779 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2780 <div class="mt-auto"> 2781 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2782 <a href="/owner-services/yacht-management" class="h18 box-link">Yacht Management</a> 2783 </div> 2784 </div> 2785 </div> 2786 </div> 2787 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2788 <div class="absolute inset-0 z-10 w-full h-full"> 2789 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2790 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2791 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2792 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-m/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2793 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2794 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp">
2795 <img src="https://camperandnicholsons.com/IMAGE/947451/h-ml-l/camperandnicholsons-_a_c&n_947451h-ml-l.webp" class="" alt="" loading='lazy' > 2796 </picture> 2797 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2798 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2799 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947451/s-m/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2800 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2801 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947451/h-s/camperandnicholsons-_a_c&n_947451h-ml-l.webp"> 2802 <img src="https://camperandnicholsons.com/IMAGE/947451/h-ml-l/camperandnicholsons-_a_c&n_947451h-ml-l.webp" class="" alt="" loading='lazy' > 2803 </picture> 2804 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2805 <div class="mt-auto"> 2806 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2807 <a href="/owner-services/insurance-solutions" class="h18 box-link">Insurance Solutions</a> 2808 </div> 2809 </div> 2810 </div> 2811 </div> 2812 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2813 <div class="absolute inset-0 z-10 w-full h-full"> 2814 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2815 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2816 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2817 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-m/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2818 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2819 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2820 <img src="https://camperandnicholsons.com/IMAGE/947450/h-ml-l/camperandnicholsons-_a_c&n_947450h-ml-l.webp" class="" alt="" loading='lazy' > 2821 </picture> 2822 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2823 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2824 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947450/s-m/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2825 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2826 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947450/h-s/camperandnicholsons-_a_c&n_947450h-ml-l.webp"> 2827 <img src="https://camperandnicholsons.com/IMAGE/947450/h-ml-l/camperandnicholsons-_a_c&n_947450h-ml-l.webp" class="" alt="" loading='lazy' > 2828 </picture> 2829 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2830 <div class="mt-auto"> 2831 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2832 <a href="/owner-services/corporate-services" class="h18 box-link">Corporate Services</a> 2833 </div> 2834 </div> 2835 </div> 2836 </div> 2837 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2838 <div class="absolute inset-0 z-10 w-full h-full"> 2839 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2840 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2841 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2841com/IMAGE/947449/s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2842 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-m/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2843 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2844 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2845 <img src="https://camperandnicholsons.com/IMAGE/947449/h-ml-l/camperandnicholsons-_a_c&n_947449h-ml-l.webp" class="" alt="" loading='lazy' > 2846 </picture> 2847 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2848 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2849 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947449/s-m/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2850 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2851 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947449/h-s/camperandnicholsons-_a_c&n_947449h-ml-l.webp"> 2852 <img src="https://camperandnicholsons.com/IMAGE/947449/h-ml-l/camperandnicholsons-_a_c&n_947449h-ml-l.webp" class="" alt="" loading='lazy' > 2853 </picture> 2854 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2855 <div class="mt-auto"> 2856 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2857 <a href="/owner-services/charter-management" class="h18 box-link">Charter Management</a> 2858 </div> 2859 </div> 2860 </div> 2861 </div> 2862 </div> 2863 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="6"> 2864 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2865 <div class="absolute inset-0 z-10 w-full h-full"> 2866 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2867 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2868 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2869 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-m/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2870 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2871 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2872 <img src="https://camperandnicholsons.com/IMAGE/947448/h-ml-l/camperandnicholsons-_a_c&n_947448h-ml-l.webp" class="" alt="" loading='lazy' > 2873 </picture> 2874 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2875 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2876 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947448/s-m/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2877 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947448/h-s-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2878 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
2878com/IMAGE/947448/h-s/camperandnicholsons-_a_c&n_947448h-ml-l.webp"> 2879 <img src="https://camperandnicholsons.com/IMAGE/947448/h-ml-l/camperandnicholsons-_a_c&n_947448h-ml-l.webp" class="" alt="" loading='lazy' > 2880 </picture> 2881 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2882 <div class="mt-auto"> 2883 <h3 class="h10 all-caps mb-[10px]">Service</h3> 2884 <a href="/crew-placement" class="h18 box-link">Crew Placement</a> 2885 </div> 2886 </div> 2887 </div> 2888 </div> 2889 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2890 <div class="absolute inset-0 z-10 w-full h-full"> 2891 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2892 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2893 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2894 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-m/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2895 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2896 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2897 <img src="https://camperandnicholsons.com/IMAGE/947447/h-ml-l/camperandnicholsons-_a_c&n_947447h-ml-l.webp" class="" alt="" loading='lazy' > 2898 </picture> 2899 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2900 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2901 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947447/s-m/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2902 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2903 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947447/h-s/camperandnicholsons-_a_c&n_947447h-ml-l.webp"> 2904 <img src="https://camperandnicholsons.com/IMAGE/947447/h-ml-l/camperandnicholsons-_a_c&n_947447h-ml-l.webp" class="" alt="" loading='lazy' > 2905 </picture> 2906 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2907 <div class="mt-auto"> 2908 <h3 class="h10 all-caps mb-[10px]">Crew Positions</h3> 2909 <a href="/crew-placement/superyacht-crew-jobs" class="h18 box-link">Service</a> 2910 </div> 2911 </div> 2912 </div> 2913 </div> 2914 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2915 <div class="absolute inset-0 z-10 w-full h-full"> 2916 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2917 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2918 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2919 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-m/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2920 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2921 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.
2921com/IMAGE/947446/h-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2922 <img src="https://camperandnicholsons.com/IMAGE/947446/h-ml-l/camperandnicholsons-_a_c&n_947446h-ml-l.webp" class="" alt="" loading='lazy' > 2923 </picture> 2924 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2925 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2926 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947446/s-m/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2927 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2928 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947446/h-s/camperandnicholsons-_a_c&n_947446h-ml-l.webp"> 2929 <img src="https://camperandnicholsons.com/IMAGE/947446/h-ml-l/camperandnicholsons-_a_c&n_947446h-ml-l.webp" class="" alt="" loading='lazy' > 2930 </picture> 2931 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2932 <div class="mt-auto"> 2933 <h3 class="h10 all-caps mb-[10px]">Register</h3> 2934 <a href="/register" class="h18 box-link">Sign Up Today</a> 2935 </div> 2936 </div> 2937 </div> 2938 </div> 2939 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2940 <div class="absolute inset-0 z-10 w-full h-full"> 2941 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2942 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2943 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2944 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-m/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2945 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2946 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2947 <img src="https://camperandnicholsons.com/IMAGE/947445/h-ml-l/camperandnicholsons-_a_c&n_947445h-ml-l.webp" class="" alt="" loading='lazy' > 2948 </picture> 2949 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2950 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2951 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947445/s-m/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2952 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2953 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947445/h-s/camperandnicholsons-_a_c&n_947445h-ml-l.webp"> 2954 <img src="https://camperandnicholsons.com/IMAGE/947445/h-ml-l/camperandnicholsons-_a_c&n_947445h-ml-l.webp" class="" alt="" loading='lazy' > 2955 </picture> 2956 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2957 <div class="mt-auto"> 2958 <h3 class="h10 all-caps mb-[10px]">Contact</h3> 2959 <a href="/contact-us" class="h18 box-link">Speak to Our Team</a> 2960 </div> 2961 </div> 2962 </div> 2963 </div> 2964 </div> 2965 <div class="js-card-grid grid grid-cols-1 r:grid-cols-2 h-full absolute inset-0" data-nav-index="7"> 2966 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2967 <div class="absolute inset-0 z-10 w-full h-full"> 2968 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2969 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2970 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
2970com/IMAGE/947444/s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2971 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-m/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2972 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2973 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2974 <img src="https://camperandnicholsons.com/IMAGE/947444/h-ml-l/camperandnicholsons-_a_c&n_947444h-ml-l.webp" class="" alt="" loading='lazy' > 2975 </picture> 2976 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 2977 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2978 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947444/s-m/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2979 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2980 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947444/h-s/camperandnicholsons-_a_c&n_947444h-ml-l.webp"> 2981 <img src="https://camperandnicholsons.com/IMAGE/947444/h-ml-l/camperandnicholsons-_a_c&n_947444h-ml-l.webp" class="" alt="" loading='lazy' > 2982 </picture> 2983 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 2984 <div class="mt-auto"> 2985 <h3 class="h10 all-caps mb-[10px]">About</h3> 2986 <a href="/the-brand" class="h18 box-link">The Brand</a> 2987 </div> 2988 </div> 2989 </div> 2990 </div> 2991 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 2992 <div class="absolute inset-0 z-10 w-full h-full"> 2993 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 2994 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 2995 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2996 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-m/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2997 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2998 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 2999 <img src="https://camperandnicholsons.com/IMAGE/947443/h-ml-l/camperandnicholsons-_a_c&n_947443h-ml-l.webp" class="" alt="" loading='lazy' > 3000 </picture> 3001 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 3002 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 3003 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947443/s-m/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 3004 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 3005 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947443/h-s/camperandnicholsons-_a_c&n_947443h-ml-l.webp"> 3006 <img src="https://camperandnicholsons.com/IMAGE/947443/h-ml-l/camperandnicholsons-_a_c&n_947443h-ml-l.webp" class="" alt="" loading='lazy' > 3007 </picture> 3008 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 3009 <div class="mt-auto"> 3010 <h3 class="h10 all-caps mb-[10px]">About</h3> 3011 <a href="/office" class="h18 box-link">The Locations</a> 3012 </div> 3013 </div> 3014 </div> 3015 </div> 3016 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 3017 <div class="absolute inset-0 z-10 w-full h-full"> 3018 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 3019 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 3020 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
3020com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3021 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3022 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3023 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3024 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 3025 </picture> 3026 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 3027 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3028 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947442/s-m/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3029 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3030 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947442/h-s/camperandnicholsons-_a_c&n_947442h-ml-l.webp"> 3031 <img src="https://camperandnicholsons.com/IMAGE/947442/h-ml-l/camperandnicholsons-_a_c&n_947442h-ml-l.webp" class="" alt="" loading='lazy' > 3032 </picture> 3033 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 3034 <div class="mt-auto"> 3035 <h3 class="h10 all-caps mb-[10px]">About</h3> 3036 <a href="/team" class="h18 box-link">The Team</a> 3037 </div> 3038 </div> 3039 </div> 3040 </div> 3041 <div class="relative w-full flex flex-col flex-1 h-[300px] s:h-[25vh] r:h-[50vh] group overflow-hidden"> 3042 <div class="absolute inset-0 z-10 w-full h-full"> 3043 <div class="z-20 absolute inset-0 w-full h-full pointer-events-none [background:linear-gradient(180deg,rgba(0,0,0,0)_0%,rgba(0,0,0,0.4)_100%)]"></div> 3044 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover"> 3045 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3046 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-m/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3047 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3048 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3049 <img src="https://camperandnicholsons.com/IMAGE/947441/h-ml-l/camperandnicholsons-_a_c&n_947441h-ml-l.webp" class="" alt="" loading='lazy' > 3050 </picture> 3051 <picture class="w-full h-full object-cover absolute z-10 inset-0 w-full h-full object-cover opacity-0 group-hover:opacity-100 transition-opacity"> 3052 <source media="(max-width:480px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3053 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/947441/s-m/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3054 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3055 <source media="(max-width:1900px)" srcset="https://camperandnicholsons.com/IMAGE/947441/h-s/camperandnicholsons-_a_c&n_947441h-ml-l.webp"> 3056 <img src="https://camperandnicholsons.com/IMAGE/947441/h-ml-l/camperandnicholsons-_a_c&n_947441h-ml-l.webp" class="" alt="" loading='lazy' > 3057 </picture> 3058 <div class="absolute inset-0 z-30 flex flex-col w-full h-full p-[20px] text-white group-hover:-translate-y-4 transition-transform"> 3059 <div class="mt-auto"> 3060 <h3 class="h10 all-caps mb-[10px]">About</h3> 3061 <a href="/academy" class="h18 box-link">The Academy</a> 3062 </div> 3063 </div> 3064 </div> 3065 </div> 3066 </div> 3067 <div class="js-card-grid h-full absolute inset-0" data-nav-index="8"> 3068 <picture class="w-full h-full object-cover w-full h-full object-cover"> 3069 <source media="(max-width:480px)" srcset="https://camperandnicholsons.
3069com/IMAGE/0/h-nl-m/camperandnicholsons-contact_a_c&n_0h-l.jpg"> 3070 <source media="(max-width:768px)" srcset="https://camperandnicholsons.com/IMAGE/0/h-ml/camperandnicholsons-contact_a_c&n_0h-l.jpg"> 3071 <source media="(max-width:1200px)" srcset="https://camperandnicholsons.com/IMAGE/0/h-m-m/camperandnicholsons-contact_a_c&n_0h-l.jpg"> 3072 <source media="(max-width:1920px)" srcset="https://camperandnicholsons.com/IMAGE/0/ml/camperandnicholsons-contact_a_c&n_0h-l.jpg"> 3073 <img src="https://camperandnicholsons.com/IMAGE/0/h-l/camperandnicholsons-contact_a_c&n_0h-l.jpg" class="" alt="Contact" loading='lazy' > 3074 </picture> 3075 </div> 3076 </div> 3077 </div> 3078 3079 </div> 3080 </div> 3081 3082 <div class="relative z-10 justify-self-center"> 3083 <div class="hidden s:block"> 3084 <a href="/"> 3085 3086 <svg class="text-white" width="235" height="14" viewBox="0 0 235 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 3087 <path d="M7.16719 13.9991C3.14019 13.9991 0 10.9316 0 7.0064C0 3.08117 3.15472 0.0136719 7.19626 0.0136719C11.2378 0.0136719 11.8629 1.20578 13.0987 3.2847L11.136 4.6658C10.162 3.1684 8.83904 2.41243 7.19626 2.41243C4.57944 2.41243 2.68951 4.34597 2.68951 7.02094C2.68951 9.69592 4.57944 11.5858 7.19626 11.5858C9.81308 11.5858 10.162 10.8299 11.136 9.33247L13.0987 10.7136C11.9065 12.7634 9.69678 13.9846 7.18172 13.9846" fill="currentColor"/> 3088 <path d="M20.6456 4.88477L22.6082 9.85673H18.683L20.6456 4.88477ZM20.1513 0.261719L14.2344 13.7384H17.0257L17.7962 11.9502H23.5096L24.2801 13.7384H27.0713L21.169 0.261719H20.1513Z" fill="currentColor"/> 3089 <path d="M41.4061 0.261719L35.7654 7.47252L30.1392 0.261719H29.1797V13.7384H31.782V6.28041L35.3583 10.7581H36.1724L39.7633 6.28041V13.7384H42.3656V0.261719H41.4061Z" fill="currentColor"/> 3090 <path d="M48.3132 6.6584H50.7411C52.0495 6.6584 52.9072 5.84427 52.9072 4.57948C52.9072 3.31468 52.064 2.54417 50.7411 2.54417H48.3132V6.67293V6.6584ZM45.7109 13.7384V0.261719H50.7556C53.6486 0.261719 55.5967 1.99173 55.5967 4.57948C55.5967 7.16722 53.605 8.91177 50.7556 8.91177H48.3278V13.7384H45.7255H45.7109Z" fill="currentColor"/> 3091 <path d="M58.1953 0.261719V13.7384H67.4414V11.4123H60.7976V7.76328H65.4933V5.56805H60.7976V2.60232H67.1943V0.261719H58.1953Z" fill="currentColor"/> 3092 <path d="M73.0398 6.64386H75.4676C76.8051 6.64386 77.6338 5.8588
30921 77.6338 4.57948C77.6338 3.30014 76.7906 2.54417 75.4676 2.54417H73.0398V6.64386ZM78.7823 13.7384L75.235 8.91177H73.0398V13.7384H70.4375V0.261719H75.4821C78.3752 0.261719 80.3233 1.99173 80.3233 4.57948C80.3233 7.16722 79.4655 7.66151 77.9827 8.38841L77.8809 8.43202L81.7044 13.7384H78.7968H78.7823Z" fill="currentColor"/> 3093 <path d="M112.581 0.261719V8.56286L104.76 0.261719H103.742V13.7384H106.359V5.3936L114.166 13.7384H115.198V0.261719H112.581Z" fill="currentColor"/> 3094 <path d="M121.493 0.261719H118.891V13.7384H121.493V0.261719Z" fill="currentColor"/> 3095 <path d="M131.581 13.9991C130.913 13.9991 130.273 13.9119 129.648 13.752C126.508 12.9379 124.414 10.2338 124.414 7.0064C124.414 3.77899 126.522 1.07494 129.677 0.260817C130.287 0.1009 130.942 0.0136719 131.61 0.0136719C132.279 0.0136719 132.904 0.1009 133.515 0.260817C135.201 0.711492 136.626 1.7873 137.513 3.2847L135.55 4.6658C134.576 3.1684 133.253 2.41243 131.61 2.41243C128.994 2.41243 127.104 4.34597 127.104 7.02094C127.104 9.69592 128.994 11.5858 131.61 11.5858C134.227 11.5858 134.576 10.8299 135.55 9.33247L137.513 10.7136C136.64 12.211 135.23 13.2868 133.515 13.7375C132.904 13.8974 132.25 13.9846 131.596 13.9846" fill="currentColor"/> 3096 <path d="M148.941 0.261719V5.5099H142.718V0.261719H140.102V13.7384H142.718V7.83597H148.941V13.7384H151.557V0.261719H148.941Z" fill="currentColor"/> 3097 <path d="M161.441 2.41243C158.838 2.41243 156.948 4.34597 156.948 7.0064C156.948 9.66684 158.795 11.6004 161.441 11.6004C164.087 11.6004 165.918 9.66684 165.918 7.0064C165.918 4.34597 164.028 2.41243 161.441 2.41243ZM161.426 13.9991C160.772 13.9991 160.118 13.9119 159.507 13.752C156.381 12.9379 154.273 10.2193 154.273 7.0064C154.273 3.79353 156.381 1.07494 159.522 0.260817C160.132 0.1009 160.772 0.0136719 161.426 0.0136719C162.08 0.0136719 162.72 0.1009 163.331 0.260817C166.5 1.07494 168.622 3.79353 168.622 7.0064C168.622 10.2193 166.5 12.9233 163.345 13.752C162.72 13.9119 162.08 13.9991 161.426 13.9991Z" fill="currentColor"/> 3098 <path d="M171.375 0.261719V13.7384H179.952V11.4123H173.977V0.261719H171.375Z" fill="currentColor"/> 3099 <path d="M186.825 14C186.214 14 185.618 13.9128 185.051 13.7529C183.612 13.3313 182.405 12.4008 181.664 11.0924L183.452 9.7404C184.121 10.6708 185.124 11.6885 186.825 11.6885C188.526 11.6885 188.86 11.0779 188.86 10.0893C188.86 9.10073 188.148 8.80997 187.072 8.30114L185.604 7.6324C183.35 6.61475 182.347 5.42264 182.347 3.77986C182.347 2.13707 183.38 0.77051 185.11 0.247145C185.618 0.0872281 186.185 0 186.781 0C187.377 0 187.915 0.0872281 188.439 0.247145C189.631 0.610593 190.576 1.3811 191.186 2.47144L189.427 3.82347C188.715 2.79128 187.857 2.29699 186.796 2.29699C185.735 2.29699 185.008 2.84943 185.008 3.7217C185.008 4.59398 185.691 4.94289 186.665 5.37903L188.221 6.06231C190.576 7.10904 191.535 8.24299 191.535 9.973C191.535 11.703 190.445 13.1859 188.599 13.7383C188.046 13.8982 187.45 13.9855 186.84 13.9855" fill="currentColor"/> 3100 <path d="M200.752 2.41243C198.15 2.41243 196.274 4.34597 196.274 7.0064C196.274 9.66684 198.121 11.6004 200.752 11.6004C203.383 11.6004 205.244 9.66684 205.244 7.0064C205.244 4.34597 203.354 2.41243 200.752 2.41243ZM200.723 13.9991C200.069 13.9991 199.429 13.9119 198.804 13.752C195.678 12.9379 193.57 10.2193 193.57 7.0064C193.57 3.79353 195.678 1.07494 198.818 0.260817C199.429 0.1009 200.069 0.0136719 200.723 0.0136719C201.377 0.0136719 202.017 0.1009 202.627 0.260817C205.797 1.07494 207.919 3.79353 207.919 7.0064C207.919 10.2193 205.797 12.9233 202.642 13.752C202.017 13.9119 201.377 13.9991 200.723 13.9991Z" fill="currentColor"/> 3101 <path d="M219.48 0.261719V8.56286L211.658 0.261719H210.641V13.7384H213.243V5.3936L221.064 13.7384H222.096V0.261719H219.48Z" fill="currentColor"/> 3102 <path d="M229.638 14C227.442 14 225.523 12.9097 224.477 11.0924L226.265 9.7404C226.933 10.6708 227.937 11.6885 229.638 11.6885C231.338 11.6885 231.673 11.0779 231.673 10.0893C231.673 9.10073 230.96 8.80997 229.87 8.30114L228.402 7.6324C226.148 6.61475 225.145 5.42264 225.145 3.77986C225.145 2.13707 226.977 0 229.579 0C232.182 0 233.083 0.901351 233.97 2.47144L232.211 3.82347C231.498 2.79128 230.641 2.29699 229.579 2.29699C228.518 2.29699 227.791 2.84943 227.791 3.7217C227.791 4.59398 228.474 4.94289 229.434 5.37903L230.99 6.06231C233.345 7.10904 234.304 8.24299 234.304 9.973C234.304 11.703 232.414 13.9855 229.608 13.9855" fill="currentColor"/> 3103 <path d="M90.1811 8.7073C89.2362 9.1289 88.7855 9.72495 88.7855 10.51C88.7855 11.295 88.9454 11.3096 89.2653 11.6003C89.5996 11.9
3103056 90.0212 12.051 90.5591 12.051C91.3296 12.051 91.9984 11.7748 92.609 11.2078L92.6817 11.1351L90.2393 8.67822L90.1811 8.7073ZM90.5591 13.9264C89.8032 13.9264 89.1199 13.7956 88.5384 13.5193C87.9423 13.2431 87.4771 12.8506 87.1427 12.3418C86.8229 11.8329 86.6484 11.2369 86.6484 10.5681C86.6484 9.89941 86.8665 9.12889 87.2881 8.54738C87.6515 8.05309 88.1604 7.64603 88.8146 7.3262L88.9163 7.28258L88.8582 7.19536C88.6837 6.94821 88.5529 6.7156 88.4657 6.49754C88.3348 6.1777 88.2767 5.81425 88.2767 5.42173C88.2767 5.02921 88.4075 4.47677 88.6547 4.08424C88.9018 3.69172 89.2653 3.38642 89.745 3.16835C90.2102 2.95029 90.7481 2.83398 91.3442 2.83398C91.9402 2.83398 92.4927 2.95029 92.9288 3.19743C93.3795 3.44458 93.7139 3.77895 93.9319 4.20055C94.15 4.62215 94.2372 5.08736 94.1936 5.61072V5.81425H92.0565V5.58165C92.0565 5.27635 91.9984 5.05828 91.853 4.89837C91.7076 4.73845 91.5186 4.66576 91.2569 4.66576C90.9953 4.66576 90.7772 4.73845 90.6318 4.88383C90.4719 5.02921 90.3992 5.20366 90.3992 5.42173C90.3992 5.6398 90.4574 5.87241 90.6027 6.09047C90.7481 6.33762 91.0098 6.65745 91.3733 7.06451L93.961 9.63772L94.0191 9.53596C94.3099 9.09982 94.5571 8.62007 94.7315 8.12578L94.7897 7.95133H97.0721L96.9703 8.25662C96.6214 9.25974 96.1417 10.2192 95.5456 11.0915L95.502 11.1497L98.1043 13.7374H95.2694L94.0918 12.5598L94.0191 12.618C93.5685 13.0251 93.0887 13.3303 92.5654 13.5484C91.9548 13.7956 91.2715 13.9264 90.5301 13.9264" fill="currentColor"/> 3104 </svg> 3105 </a> 3106 </div> 3107 <div class="block s:hidden"> 3108 <a href="/"> 3109 <svg class="' . $color . '" width="40" height="14" viewBox="0 0 40 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 3110 <path d="M7.17483 13.986C3.14685 13.986 0 10.9091 0 6.99301C0 3.07692 3.16084 0 7.2028 0C11.2448 0 11.8741 1.18881 13.1049 3.27273L11.1469 4.65734C10.1818 3.16084 8.85315 2.40559 7.2028 2.40559C4.58741 2.40559 2.6993 4.34965 2.6993 7.02098C2.6993 9.69231 4.6014 11.5944 7.2028 11.5944C9.8042 11.5944 10.1678 10.8392 11.1469 9.34266L13.1049 10.7273C11.9021 12.7832 9.7063 14 7.17483 14" fill="currentColor" /> 3111 <path d="M37.2281 0.251953V8.55965L29.396 0.251953H28.375V13.7345H30.9904V5.38482L38.8086 13.7345H39.8435V0.251953H37.2281Z" fill="currentColor" /> 3112 <path d="M18.5463 8.69866C17.6092 9.11824 17.1477 9.70565 17.1477 10.5029C17.1477 11.3001 17.3015 11.3001 17.6372 11.5938C17.9728 11.9015 18.3924 12.0413 18.9239 12.0413C19.6931 12.0413 20.3645 11.7616 20.9798 11.2022L21.0498 11.1322L18.6022 8.67069L18.5463 8.69866ZM18.9239 13.9154C18.1687 13.9154 17.4833 13.7756 16.8959 13.5098C16.2945 13.2301 15.833 12.8385 15.4973 12.335C15.1756 11.8175 15.0078 11.2301 15.0078 10.5588C15.0078 9.88747 15.2316 9.11824 15.6512 8.53083C16.0148 8.04132 16.5183 7.62174 17.1756 7.30006L17.2735 7.2581L17.2036 7.17418C17.0358 6.93642 16.8959 6.69866 16.812 6.47488C16.6861 6.15321 16.6162 5.78957 16.6162 5.39796C16.6162 5.00635 16.7421 4.4609 16.9938 4.06929C17.2456 3.67768 17.6092 3.36999 18.0847 3.14621C18.5463 2.92244 19.0777 2.81055 19.6791 2.81055C20.2805 2.81055 20.826 2.93642 21.2735 3.17418C21.7211 3.41195 22.0568 3.74761 22.2805 4.18118C22.5043 4.60076 22.5882 5.07628 22.5463 5.57978V5.78957H20.4064V5.55181C20.4204 5.24411 20.3505 5.02034 20.2106 4.86649C20.0707 4.71265 19.8749 4.64272 19.6092 4.64272C19.3435 4.64272 19.1337 4.71265 18.9798 4.86649C18.826 5.02034 18.7421 5.18817 18.7421 5.39796C18.7421 5.60775 18.812 5.84551 18.9379 6.06929C19.0777 6.30705 19.3435 6.64272 19.7071 7.03432L22.2945 9.60775L22.3645 9.50985C22.6582 9.07628 22.8959 8.60076 23.0777 8.09726L23.1337 7.92943H25.4274L25.3295 8.22314C24.9798 9.23013 24.5043 10.1952 23.9029 11.0623L23.861 11.1322L26.4624 13.7196H23.6232L22.4484 12.5448L22.3784 12.6008C21.9309 13.0064 21.4414 13.314 20.9239 13.5238C20.3225 13.7756 19.6372 13.9015 18.8959 13.9015" fill="currentColor" /> 3113 </a> 3114 </div> 3115 </div> 3116 3117 <!-- Right section --> 3118 <div class="relative z-10 flex items-center justify-end"> 3119 <a href="/contact-us" class="body-12 font-medium all-caps p-fix h-[40p
3119x] items-center mx-[10px] hidden r:flex relative before:absolute before:content-[''] before:w-0 before:h-[1px] before:bg-current before:bottom-0 before:left-0 hover:before:w-full before:transition-all">Contact</a> 3120 <div class="h-[16px] w-[1px] mx-[10px] bg-white/20 hidden r:block"></div> 3121 <div class="flex items-center gap-[10px]"> 3122 <button 3123 @click="$dispatch('open-search')" 3124 x-tooltip="{ 3125 content: () => 'Search', 3126 theme: 'cn', 3127 }" 3128 class="group relative w-[40px] h-[40px] flex items-center justify-center"> 3129 <svg class="w-[18px] h-[18px]" aria-hidden="true" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 3130 <path d="M7.80078 13.8008C11.1145 13.8008 13.8008 11.1145 13.8008 7.80078C13.8008 4.48707 11.1145 1.80078 7.80078 1.80078C4.48707 1.80078 1.80078 4.48707 1.80078 7.80078C1.80078 11.1145 4.48707 13.8008 7.80078 13.8008Z" stroke="currentColor" stroke-miterlimit="10" /> 3131 <path d="M12.1992 12.2012L16.1992 16.2012" stroke="currentColor" stroke-miterlimit="10" /> 3132 </svg> 3133 </button> 3134 <button 3135 x-ref="favouritesButton" 3136 x-init=" 3137 console.log('Button init'); 3138 // Check multiple times for Tippy initialization 3139 let checkCount = 0; 3140 const checkInterval = setInterval(() => { 3141 checkCount++; 3142 console.log(`Check ${checkCount}: Tippy exists:`, !!$el._tippy); 3143 if ($el._tippy || checkCount > 10) { 3144 clearInterval(checkInterval); 3145 if ($el._tippy) { 3146 console.log('Tippy initialized successfully'); 3147 } else { 3148 console.error('Tippy failed to initialize after 10 checks'); 3149 } 3150 } 3151 }, 100); 3152 " 3153 x-tooltip="{ 3154 content: () => 'Favourites', 3155 theme: 'cn', 3156 }" 3157 @click="console.log('Button clicked, Tippy:', $el._tippy)" 3158 class="relative w-[40px] h-[40px] flex items-center justify-center hidden" 3159 style="display:none"> 3160 <svg class="w-[18px] h-[18px]" aria-hidden="true" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"> 3161 <path d="M16 7.08479C16 8.13146 15.6117 9.17581 14.8395 9.97471L14.5993 10.2248L9.00084 16L3.15998 9.97239C1.61334 8.37692 1.61334 5.79266 3.15998 4.19719C3.93218 3.39829 4.94681 3 5.95919 3C6.97158 3 7.98621 3.39829 8.76065 4.19719L9.00309 4.44727L9.24328 4.19719C10.7877 2.60171 13.2928 2.60171 14.8395 4.19719C15.6117 4.99608 16 6.04043 16 7.08479Z" stroke="currentColor" stroke-miterlimit="10" /> 3162 </svg> 3163 <!-- Favourites indicator dot --> 3164 <span 3165 x-show="hasSavedYachts" 3166 x-transition:enter="transition ease-out duration-200" 3167 x-transition:enter-start="opacity-0 scale-0" 3168 x-transition:enter-end="opacity-100 scale-100" 3169 x-transition:leave="transition ease-in duration-150" 3170 x-transition:leave-start="opacity-100 scale-100" 3171 x-transition:leave-end="opacity-0 scale-0" 3172 class="absolute top-[6px] right-[6px] w-[6px] h-[6px] bg-white rounded-full pointer-events-none"> 3173 </span> 3174 </button> 3175 3176 <a x-tooltip="{ 3177 content: () => 'Account', 3178 theme: 'cn', 3179 }" 3180 href="/login" x-tooltip="tooltip" class="group relative w-[40px] h-[40p
3180x] items-center justify-center hidden r:flex"> 3181 <svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 3182 <path d="M6.84062 8.12264C8.86249 8.12264 10.5015 6.48359 10.5015 4.46171C10.5015 2.43984 8.86249 0.800781 6.84062 0.800781C4.81874 0.800781 3.17969 2.43984 3.17969 4.46171C3.17969 6.48359 4.81874 8.12264 6.84062 8.12264Z" stroke="currentColor" stroke-miterlimit="10" /> 3183 <path d="M0.703125 15.2005V14.2564C0.703125 10.8674 3.45075 8.11719 6.8423 8.11719C10.2313 8.11719 12.9815 10.8648 12.9815 14.2564V15.2005" stroke="currentColor" stroke-miterlimit="10" /> 3184 </svg> 3185 </a> 3186 </div> 3187 </div> 3188 </header> 3189 <div 3190 x-data="searchOverlay" 3191 x-cloak 3192 @open-search.window="openSearch()" 3193 x-ref="searchOverlay" 3194 class="fixed inset-x-0 top-0 w-screen max-h-[100dvh] z-[400] overflow-hidden" 3195 :class="{ 'pointer-events-auto': open, 'pointer-events-none': !open }" 3196 data-lenis-prevent 3197 > 3198 <!-- Sliding white background --> 3199 <div x-ref="searchBg" class="absolute inset-0 bg-white"></div> 3200 3201 <!-- All content wrapped in relative container --> 3202 <div x-ref="searchInner" class="relative z-10 max-h-[100dvh] overflow-y-auto"> 3203 <!-- Sticky header --> 3204 <div class="sticky top-0 z-20 bg-white"> 3205 <!-- Close button bar --> 3206 <div x-ref="searchClose" class="js-search-close container flex items-center h-[var(--header-height)]"> 3207 <button @click="closeSearch()" class="group flex items-center gap-[10px] h-[40px] pr-[10px] text-black"> 3208 <svg class="w-[22px] h-[22px]" aria-hidden="true" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> 3209 <path d="M9.6001 9.59844L2.4001 2.39844" stroke="currentColor" stroke-miterlimit="10" /> 3210 <path d="M2.4001 9.59844L9.6001 2.39844" stroke="currentColor" stroke-miterlimit="10" /> 3211 </svg> 3212 <span class="body-12 font-medium all-caps p-fix">Close</span> 3213 </button> 3214 </div> 3215 3216 <!-- Search input --> 3217 <div x-ref="searchInputWrap" class="js-search-input border-b border-[#f4f2f0]"> 3218 <div class="flex items-center"> 3219 <input 3220 x-ref="searchInput" 3221 x-model="searchQuery" 3222 type="text" 3223 placeholder="Search" 3224 class="w-full h-[120px] px-[20px] 2xl:px-[40px] h34 text-black placeholder:text-black/30 bg-transparent outline-none border-none" 3225 /> 3226 <button 3227 x-ref="searchClear" 3228 x-show="searchQuery.length > 0" 3229 x-transition:enter="transition ease-out duration-200" 3230 x-transition:enter-start="opacity-0" 3231 x-transition:enter-end="opacity-100" 3232 x-transition:leave="transition ease-in duration-150" 3233 x-transition:leave-start="opacity-100" 3234 x-transition:leave-end="opacity-0" 3235 @click="searchQuery = ''; $refs.searchInput.focus()" 3236 class="flex items-center justify-center w-[40px] h-[40px] mr-[20px] 2xl:mr-[40px] shrink-0 text-black" 3237 > 3238 <svg class="w-[18px] h-[18px]" aria-hidden="true" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> 3239 <path d="M9.6001 9.59844L2.4001 2.39844" stroke="currentColor" stroke-miterlimit="10" /> 3240 <path d="M2.4001 9.59844L9.6001 2.39844" stroke="currentColor" stroke-miterlimit="10" /> 3241 </svg> 3242 </button> 3243 </div> 3244 </div> 3245 </div> 3246 3247 <!-- Scrollable content --> 3248 <div x-ref="searchContent"> 3249 3250 <!-- No results message --> 3251 <div 3252 x-ref="searchNoResults" 3253 x-show="noResults && searchQuery.length > 0" 3254 x-transition:enter="transition ease-out duration-200" 3255 x-transition:enter-start="opacity-0" 3256 x-transition:enter-end="opacity-100" 3257 x-transition:leave="transition ease-in duration-150" 3258 x-transition:leave-start="opacity-100" 3259 x-transition:leave-end="opacity-0" 3260 class="flex items-center h-[80px] border-b border-[#f4f2f0] px-[20px] 2xl:px-[40px]"
3261 > 3262 <p class="body-14" x-text="'No results for "' + searchQuery + '"'"></p> 3263 </div> 3264 3265 <!-- Suggestions wrapper (hides when results show) --> 3266 <div x-ref="searchSuggestions"> 3267 <!-- 3-column suggestions section --> 3268 <div class="grid border-b border-[#f4f2f0]" 3269 :class="noResults ? 'grid-cols-1' : 'grid-cols-1 s:grid-cols-2 r:grid-cols-3'"> 3270 <!-- Suggested --> 3271 <div class="js-search-column px-[20px] 2xl:px-[40px] py-[30px]" 3272 :class="{ 's:border-r s:border-[#f4f2f0]': !noResults }"> 3273 <p class="body-14 text-black/60 mb-[16px]">Suggested</p> 3274 <ul> 3275 <li> 3276 <a href="/charter-a-yacht" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3277 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3278 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Chartering a Yacht</span> 3279 </a> 3280 </li> 3281 <li> 3282 <a href="/buy-a-yacht" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3283 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3284 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Buying a Yacht</span> 3285 </a> 3286 </li> 3287 <li> 3288 <a href="/sell-a-yacht" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3289 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3290 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Selling a Yacht</span> 3291 </a> 3292 </li> 3293 <li> 3294 <a href="/build-a-yacht" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3295 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3296 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Building a Yacht</span> 3297 </a> 3298 </li> 3299 <li> 3300 <a href="/owner-services/yacht-management" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3301 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span>
3302 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Yacht Management</span> 3303 </a> 3304 </li> 3305 <li> 3306 <a href="/owner-services/Purchasing" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3307 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3308 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Purchasing</span> 3309 </a> 3310 </li> 3311 </ul> 3312 </div> 3313 3314 <!-- Top destinations --> 3315 <div x-show="!noResults" class="js-search-column hidden s:block px-[20px] 2xl:px-[40px] py-[30px] r:border-r r:border-[#f4f2f0]"> 3316 <p class="body-14 text-black/60 mb-[16px]">Top destinations</p> 3317 <ul> 3318 <li> 3319 <a href="/charter-a-yacht/destinations/mediterranean" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3320 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3321 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">Mediterranean</span> 3322 </a> 3323 </li> 3324 <li> 3325 <a href="/charter-a-yacht/destinations/bahamas" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3326 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3327 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">The Bahamas</span> 3328 </a> 3329 </li> 3330 <li> 3331 <a href="/charter-a-yacht/destinations/caribbean" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3332 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span> 3333 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">The Caribbean</span> 3334 </a> 3335 </li> 3336 <li> 3337 <a href="/charter-a-yacht/destinations/south-pacific" class="group body-16 all-caps relative flex items-center h-[40px] text-black overflow-hidden"> 3338 <span class="absolute top-1/2 right-full -translate-y-1/2 mr-[5px] w-[20px] h-[1px] bg-black pointer-events-none transition-all duration-200 ease-out opacity-0 group-hover:opacity-100 group-hover:translate-x-[15px]"></span>
3339 <span class="transition-transform duration-200 ease-out group-hover:translate-x-[15px]">South Pacific</span> 3340 </a> 3341 </li> 3342 </ul> 3343 </div> 3344 3345 <!-- Top experiences --> 3346 <div x-show="!noResults" class="js-search-column hidden r:block px-[20px] 2xl:px-[40px] py-[30px]"> 3347 <p class="body-14 text-black/60 mb-[16px]">Top experiences</p> 3348 <ul> 3349 </ul> 3350 </div> 3351 </div> 3352 3353 <!-- Recently viewed section --> 3354 </div> 3355 3356 <!-- Search results (hidden initially, shown when query is entered) --> 3357 <div x-ref="searchResults" id="searchResult"></div> 3358 3359 </div> 3360 </div> 3361 </div> 3362 3363 <!-- Main Content --> 3364 <main 3365 x-data="{ openModal: false }" 3366 @modal.window="openModal = $event.detail" 3367 class="relative transition-all duration-[1000ms] before:content-[''] before:absolute before:inset-0 before:w-full before:h-full before:bg-black before:z-10 before:opacity-0 before:pointer-events-none before:transition-all before:duration-[1000ms] before:ease-in-out" 3368 :class="{ 'before:opacity-100 before:pointer-events-auto': openModal, 'before:opacity-0 before:pointer-events-none': !openModal }"> 3369 <div class="relative w-full h-full"> 3370
3370<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" type="text/javascript" src="/core/js/jquery-3.7.1.min.js"></script>
vendor: 2 bytes, line 3370
3370
3371<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" async type="text/javascript" src="/core/js/form.js?v=12"></script>
vendor: 2 bytes, line 3371
3371
3372<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/js/sweetalert2.min.js"></script>
3372 3373<link rel="stylesheet" type="text/css" href="/base/css/f:login/v:44" media="all" /> 3374<link rel="stylesheet" href="/core/view/website_2/src/css/output.css?v=2" /> 3375<style> 3376 @-ms-viewport{ 3377 width:device-width 3378} 3379html{ 3380 box-sizing:border-box; 3381 -ms-overflow-style:scrollbar 3382} 3383*,::after,::before{ 3384 box-sizing:inherit 3385} 3386.container-login{ 3387 width:100%; 3388 padding-right:15px; 3389 padding-left:15px; 3390 margin-right:auto; 3391 margin-left:auto 3392} 3393@media (min-width:576px){ 3394 .container-login{ 3395 max-width:540px 3396 } 3397 3398} 3399@media (min-width:768px){ 3400 .container-login{ 3401 max-width:720px 3402 } 3403 3404} 3405@media (min-width:992px){ 3406 .container-login{ 3407 max-width:960px 3408 } 3409 3410} 3411@media (min-width:1200px){ 3412 .container-login{ 3413 max-width:1140px 3414 } 3415 3416} 3417.container-fluid{ 3418 width:100%; 3419 padding-right:15px; 3420 padding-left:15px; 3421 margin-right:auto; 3422 margin-left:auto 3423} 3424.row{ 3425 display:-webkit-box; 3426 display:-ms-flexbox; 3427 display:flex; 3428 -ms-flex-wrap:wrap; 3429 flex-wrap:wrap; 3430 margin-right:-15px; 3431 margin-left:-15px 3432} 3433.no-gutters{ 3434 margin-right:0; 3435 margin-left:0 3436} 3437.no-gutters>.col,.no-gutters>[class*=col-]{ 3438 padding-right:0; 3439 padding-left:0 3440} 3441.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto,.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{ 3442 position:relative; 3443 width:100%; 3444 min-height:1px; 3445 padding-right:15px; 3446 padding-left:15px 3447} 3448.col{ 3449 -ms-flex-preferred-size:0; 3450 flex-basis:0; 3451 -webkit-box-flex:1; 3452 -ms-flex-positive:1; 3453 flex-grow:1; 3454 max-width:100% 3455} 3456.col-auto{ 3457 -webkit-box-flex:0; 3458 -ms-flex:0 0 auto; 3459 flex:0 0 auto; 3460 width:auto; 3461 max-width:none 3462} 3463.col-1{ 3464 -webkit-box-flex:0; 3465 -ms-flex:0 0 8.333333%; 3466 flex:0 0 8.333333%; 3467 max-width:8.333333% 3468} 3469.col-2{ 3470 -webkit-box-flex:0; 3471 -ms-flex:0 0 16.666667%; 3472 flex:0 0 16.666667%; 3473 max-width:16.666667% 3474} 3475.col-3{ 3476 -webkit-box-flex:0; 3477 -ms-flex:0 0 25%; 3478 flex:0 0 25%; 3479 max-width:25% 3480} 3481.col-4{ 3482 -webkit-box-flex:0; 3483 -ms-flex:0 0 33.333333%; 3484 flex:0 0 33.333333%; 3485 max-width:33.333333% 3486} 3487.col-5{ 3488 -webkit-box-flex:0; 3489 -ms-flex:0 0 41.666667%; 3490 flex:0 0 41.666667%; 3491 max-width:41.666667% 3492} 3493.col-6{ 3494 -webkit-box-flex:0; 3495 -ms-flex:0 0 50%; 3496 flex:0 0 50%; 3497 max-width:50% 3498} 3499.col-7{ 3500 -webkit-box-flex:0; 3501 -ms-flex:0 0 58.333333%; 3502 flex:0 0 58.333333%; 3503 max-width:58.333333% 3504} 3505.col-8{ 3506 -webkit-box-flex:0; 3507 -ms-flex:0 0 66.666667%; 3508 flex:0 0 66.666667%; 3509 max-width:66.666667% 3510} 3511.col-9{ 3512 -webkit-box-flex:0; 3513 -ms-flex:0 0 75%; 3514 flex:0 0 75%; 3515 max-width:75% 3516} 3517.col-10{ 3518 -webkit-box-flex:0; 3519 -ms-flex:0 0 83.333333%; 3520 flex:0 0 83.333333%; 3521 max-width:83.333333% 3522} 3523.col-11{ 3524 -webkit-box-flex:0; 3525 -ms-flex:0 0 91.666667%; 3526 flex:0 0 91.666667%; 3527 max-width:91.666667% 3528} 3529.col-12{ 3530 -webkit-box-flex:0; 3531 -ms-flex:0 0 100%; 3532 flex:0 0 100%; 3533 max-width:100% 3534} 3535.order-first{ 3536 -webkit-box-ordinal-group:0; 3537 -ms-flex-order:-1; 3538 order:-1 3539} 3540.order-last{ 3541 -webkit-box-ordinal-group:14; 3542 -ms-flex-order:13; 3543 order:13 3544} 3545.order-0{ 3546 -webkit-box-ordinal-group:1; 3547 -ms-flex-order:0; 3548 order:0 3549} 3550.order-1{ 3551 -webkit-box-ordinal-group:2; 3552 -ms-flex-order:1; 3553 order:1 3554} 3555.order-2{ 3556 -webkit-box-ordinal-group:3; 3557 -ms-flex-order:2; 3558 order:2 3559} 3560.order-3{ 3561 -webkit-box-ordinal-group:4; 3562 -ms-flex-order:3; 3563 order:3 3564} 3565.order-4{ 3566 -webkit-box-ordinal-group:5; 3567 -ms-flex-order:4; 3568 order:4 3569} 3570.order-5{ 3571 -webkit-box-ordinal-group:6; 3572 -ms-flex-order:5; 3573 order:5 3574} 3575.order-6{ 3576 -webkit-box-ordinal-group:7; 3577 -ms-flex-order:6; 3578 order:6 3579} 3580.order-7{ 3581 -webkit-box-ordinal-group:8; 3582 -ms-flex-order:7; 3583 order:7 3584} 3585.order-8{ 3586 -webkit-box-ordinal-group:9; 3587 -ms-flex-order:8; 3588 order:8 3589} 3590.order-9{ 3591 -webkit-box-ordinal-group:10; 3592 -ms-flex-order:9; 3593 order:9 3594} 3595.order-10{ 3596 -webkit-box-ordinal-group:11; 3597 -ms-flex-order:10; 3598 order:10 3599} 3600.order-11{ 3601 -webkit-box-ordinal-group:12; 3602 -ms-flex-order:11; 3603 order:11 3604} 3605.order-12{ 3606 -webkit-box-ordinal-group:13; 3607 -ms-flex-order:12; 3608 order:12 3609} 3610.offset-1{ 3611 margin-left:8.333333% 3612} 3613.offset-2{ 3614 margin-left:16.666667% 3615} 3616.offset-3{ 3617 margin-left:25% 3618} 3619.offset-4{ 3620 margin-left:33.333333% 3621} 3622.offset-5{ 3623 margin-left:41.666667% 3624} 3625.offset-6{ 3626 margin-left:50% 3627} 3628.offset-7{ 3629 margin-left:58.333333% 3630} 3631.offset-8{ 3632 margin-left:66.666667% 3633} 3634.offset-9{ 3635 margin-left:75% 3636} 3637.offset-10{ 3638 margin-left:83.333333% 3639} 3640.offset-11{ 3641 margin-left:91.666667% 3642} 3643@media (min-width:576px){ 3644 .col-sm{ 3645 -ms-flex-preferred-size:0; 3646 flex-basis:0; 3647 -webkit-box-flex:1; 3648 -ms-flex-positive:1; 3649 flex-grow:1; 3650 max-width:100% 3651 } 3652 .col-sm-auto{ 3653 -webkit-box-flex:0; 3654 -ms-flex:0 0 auto; 3655 flex:0 0 auto; 3656 width:auto; 3657 max-width:none 3658 } 3659 .col-sm-1{ 3660 -webkit-box-flex:0; 3661 -ms-flex:0 0 8.333333%; 3662 flex:0 0 8.333333%; 3663 max-width:8.333333% 3664 } 3665 .col-sm-2{ 3666 -webkit-box-flex:0; 3667 -ms-flex:0 0 16.666667%; 3668 flex:0 0 16.666667%; 3669 max-width:16.666667% 3670 } 3671 .col-sm-3{ 3672 -webkit-box-flex:0; 3673 -ms-flex:0 0 25%; 3674 flex:0 0 25%; 3675 max-width:25% 3676 } 3677 .col-sm-4{ 3678 -webkit-box-flex:0; 3679 -ms-flex:0 0 33.333333%; 3680 flex:0 0 33.333333%; 3681 max-width:33.333333% 3682 } 3683 .col-sm-5{ 3684 -webkit-box-flex:0; 3685 -ms-flex:0 0 41.666667%; 3686 flex:0 0 41.666667%; 3687 max-width:41.666667% 3688 } 3689 .col-sm-6{ 3690 -webkit-box-flex:0; 3691 -ms-flex:0 0 50%; 3692 flex:0 0 50%; 3693 max-width:50% 3694 } 3695 .col-sm-7{ 3696 -webkit-box-flex:0; 3697 -ms-flex:0 0 58.333333%; 3698 flex:0 0 58.333333%; 3699 max-width:58.333333% 3700 } 3701 .col-sm-8{ 3702 -webkit-box-flex:0; 3703 -ms-flex:0 0 66.666667%; 3704 flex:0 0 66.666667%; 3705 max-width:66.666667% 3706 } 3707 .col-sm-9{ 3708 -webkit-box-flex:0; 3709 -ms-flex:0 0 75%; 3710 flex:0 0 75%; 3711 max-width:75% 3712 } 3713 .col-sm-10{ 3714 -webkit-box-flex:0; 3715 -ms-flex:0 0 83.333333%; 3716 flex:0 0 83.333333%; 3717 max-width:83.333333% 3718 } 3719 .col-sm-11{ 3720 -webkit-box-flex:0; 3721 -ms-flex:0 0 91.666667%; 3722 flex:0 0 91.666667%; 3723 max-width:91.666667% 3724 } 3725 .col-sm-12{ 3726 -webkit-box-flex:0; 3727 -ms-flex:0 0 100%; 3728 flex:0 0 100%; 3729 max-width:100% 3730 } 3731 .order-sm-first{ 3732 -webkit-box-ordinal-group:0; 3733 -ms-flex-order:-1; 3734 order:-1 3735 } 3736 .order-sm-last{ 3737 -webkit-box-ordinal-group:14; 3738 -ms-flex-order:13; 3739 order:13 3740 } 3741 .order-sm-0{ 3742 -webkit-box-ordinal-group:1; 3743 -ms-flex-order:0; 3744 order:0 3745 } 3746 .order-sm-1{ 3747 -webkit-box-ordinal-group:2; 3748 -ms-flex-order:1; 3749 order:1 3750 } 3751 .order-sm-2{ 3752 -webkit-box-ordinal-group:3; 3753 -ms-flex-order:2; 3754 order:2 3755 } 3756 .order-sm-3{ 3757 -webkit-box-ordinal-group:4; 3758 -ms-flex-order:3; 3759 order:3 3760 } 3761 .order-sm-4{ 3762 -webkit-box-ordinal-group:5; 3763 -ms-flex-order:4; 3764 order:4 3765 } 3766 .order-sm-5{ 3767 -webkit-box-ordinal-group:6; 3768 -ms-flex-order:5; 3769 order:5 3770 } 3771 .order-sm-6{ 3772 -webkit-box-ordinal-group:7; 3773 -ms-flex-order:6; 3774 order:6 3775 } 3776 .order-sm-7{ 3777 -webkit-box-ordinal-group:8; 3778 -ms-flex-order:7; 3779 order:7 3780 } 3781 .order-sm-8{ 3782 -webkit-box-ordinal-group:9; 3783 -ms-flex-order:8; 3784 order:8 3785 } 3786 .order-sm-9{ 3787 -webkit-box-ordinal-group:10; 3788 -ms-flex-order:9; 3789 order:9 3790 } 3791 .order-sm-10{ 3792 -webkit-box-ordinal-group:11; 3793 -ms-flex-order:10; 3794 order:10 3795 } 3796 .order-sm-11{ 3797 -webkit-box-ordinal-group:12; 3798 -ms-flex-order:11; 3799 order:11 3800 } 3801 .order-sm-12{ 3802 -webkit-box-ordinal-group:13; 3803 -ms-flex-order:12; 3804 order:12 3805 } 3806 .offset-sm-0{ 3807 margin-left:0 3808 } 3809 .offset-sm-1{ 3810 margin-left:8.333333% 3811 } 3812 .offset-sm-2{ 3813 margin-left:16.666667% 3814 } 3815 .offset-sm-3{ 3816 margin-left:25% 3817 } 3818 .offset-sm-4{ 3819 margin-left:33.333333% 3820 } 3821 .offset-sm-5{ 3822 margin-left:41.666667% 3823 } 3824 .offset-sm-6{ 3825 margin-left:50% 3826 } 3827 .offset-sm-7{ 3828 margin-left:58.333333% 3829 } 3830 .offset-sm-8{ 3831 margin-left:66.666667% 3832 } 3833 .offset-sm-9{ 3834 margin-left:75% 3835 } 3836 .offset-sm-10{ 3837 margin-left:83.333333% 3838 } 3839 .offset-sm-11{ 3840 margin-left:91.666667% 3841 } 3842 3843} 3844@media (min-width:768px){ 3845 .col-md{ 3846 -ms-flex-preferred-size:0; 3847 flex-basis:0; 3848 -webkit-box-flex:1; 3849 -ms-flex-positive:1; 3850 flex-grow:1; 3851 max-width:100% 3852 } 3853 .col-md-auto{ 3854 -webkit-box-flex:0; 3855 -ms-flex:0 0 auto; 3856 flex:0 0 auto; 3857 width:auto; 3858 max-width:none 3859 } 3860 .col-md-1{ 3861 -webkit-box-flex:0; 3862 -ms-flex:0 0 8.333333%; 3863 flex:0 0 8.333333%; 3864 max-width:8.333333% 3865 } 3866 .col-md-2{ 3867 -webkit-box-flex:0; 3868 -ms-flex:0 0 16.666667%; 3869 flex:0 0 16.666667%; 3870 max-width:16.666667% 3871 } 3872 .col-md-3{ 3873 -webkit-box-flex:0; 3874 -ms-flex:0 0 25%; 3875 flex:0 0 25%; 3876 max-width:25% 3877 } 3878 .col-md-4{ 3879 -webkit-box-flex:0; 3880 -ms-flex:0 0 33.333333%; 3881 flex:0 0 33.333333%; 3882 max-width:33.333333% 3883 } 3884 .col-md-5{ 3885 -webkit-box-flex:0; 3886 -ms-flex:0 0 41.666667%; 3887 flex:0 0 41.666667%; 3888 max-width:41.666667% 3889 } 3890 .col-md-6{ 3891 -webkit-box-flex:0; 3892 -ms-flex:0 0 50%; 3893 flex:0 0 50%; 3894 max-width:50% 3895 } 3896 .col-md-7{ 3897 -webkit-box-flex:0; 3898 -ms-flex:0 0 58.333333%; 3899 flex:0 0 58.333333%; 3900 max-width:58.333333% 3901 } 3902 .col-md-8{ 3903 -webkit-box-flex:0; 3904 -ms-flex:0 0 66.666667%; 3905 flex:0 0 66.666667%; 3906 max-width:66.666667% 3907 } 3908 .col-md-9{ 3909 -webkit-box-flex:0; 3910 -ms-flex:0 0 75%; 3911 flex:0 0 75%; 3912 max-width:75% 3913 } 3914 .col-md-10{ 3915 -webkit-box-flex:0; 3916 -ms-flex:0 0 83.333333%; 3917 flex:0 0 83.333333%; 3918 max-width:83.333333% 3919 } 3920 .col-md-11{ 3921 -webkit-box-flex:0; 3922 -ms-flex:0 0 91.666667%; 3923 flex:0 0 91.666667%; 3924 max-width:91.666667% 3925 } 3926 .col-md-12{ 3927 -webkit-box-flex:0; 3928 -ms-flex:0 0 100%; 3929 flex:0 0 100%; 3930 max-width:100% 3931 } 3932 .order-md-first{ 3933 -webkit-box-ordinal-group:0; 3934 -ms-flex-order:-1; 3935 order:-1 3936 } 3937 .order-md-last{ 3938 -webkit-box-ordinal-group:14; 3939 -ms-flex-order:13; 3940 order:13 3941 } 3942 .order-md-0{ 3943 -webkit-box-ordinal-group:1; 3944 -ms-flex-order:0; 3945 order:0 3946 } 3947 .order-md-1{ 3948 -webkit-box-ordinal-group:2; 3949 -ms-flex-order:1; 3950 order:1 3951 } 3952 .order-md-2{ 3953 -webkit-box-ordinal-group:3; 3954 -ms-flex-order:2; 3955 order:2 3956 } 3957 .order-md-3{ 3958 -webkit-box-ordinal-group:4; 3959 -ms-flex-order:3; 3960 order:3 3961 } 3962 .order-md-4{ 3963 -webkit-box-ordinal-group:5; 3964 -ms-flex-order:4; 3965 order:4 3966 } 3967 .order-md-5{ 3968 -webkit-box-ordinal-group:6; 3969 -ms-flex-order:5; 3970 order:5 3971 } 3972 .order-md-6{ 3973 -webkit-box-ordinal-group:7; 3974 -ms-flex-order:6; 3975 order:6 3976 } 3977 .order-md-7{ 3978 -webkit-box-ordinal-group:8; 3979 -ms-flex-order:7; 3980 order:7 3981 } 3982 .order-md-8{ 3983 -webkit-box-ordinal-group:9; 3984 -ms-flex-order:8; 3985 order:8 3986 } 3987 .order-md-9{ 3988 -webkit-box-ordinal-group:10; 3989 -ms-flex-order:9; 3990 order:9 3991 } 3992 .order-md-10{ 3993 -webkit-box-ordinal-group:11; 3994 -ms-flex-order:10; 3995 order:10 3996 } 3997 .order-md-11{ 3998 -webkit-box-ordinal-group:12; 3999 -ms-flex-order:11; 4000 order:11 4001 } 4002 .order-md-12{ 4003 -webkit-box-ordinal-group:13; 4004 -ms-flex-order:12; 4005 order:12 4006 } 4007 .offset-md-0{ 4008 margin-left:0 4009 } 4010 .offset-md-1{ 4011 margin-left:8.333333% 4012 } 4013 .offset-md-2{ 4014 margin-left:16.666667% 4015 } 4016 .offset-md-3{ 4017 margin-left:25% 4018 } 4019 .offset-md-4{ 4020 margin-left:33.333333% 4021 } 4022 .offset-md-5{ 4023 margin-left:41.666667% 4024 } 4025 .offset-md-6{ 4026 margin-left:50% 4027 } 4028 .offset-md-7{ 4029 margin-left:58.333333% 4030 } 4031 .offset-md-8{ 4032 margin-left:66.666667% 4033 } 4034 .offset-md-9{ 4035 margin-left:75% 4036 } 4037 .offset-md-10{ 4038 margin-left:83.333333% 4039 } 4040 .offset-md-11{ 4041 margin-left:91.666667% 4042 } 4043 4044} 4045@media (min-width:992px){ 4046 .col-lg{ 4047 -ms-flex-preferred-size:0; 4048 flex-basis:0; 4049 -webkit-box-flex:1; 4050 -ms-flex-positive:1; 4051 flex-grow:1; 4052 max-width:100% 4053 } 4054 .col-lg-auto{ 4055 -webkit-box-flex:0; 4056 -ms-flex:0 0 auto; 4057 flex:0 0 auto; 4058 width:auto; 4059 max-width:none 4060 } 4061 .col-lg-1{
4062 -webkit-box-flex:0; 4063 -ms-flex:0 0 8.333333%; 4064 flex:0 0 8.333333%; 4065 max-width:8.333333% 4066 } 4067 .col-lg-2{ 4068 -webkit-box-flex:0; 4069 -ms-flex:0 0 16.666667%; 4070 flex:0 0 16.666667%; 4071 max-width:16.666667% 4072 } 4073 .col-lg-3{ 4074 -webkit-box-flex:0; 4075 -ms-flex:0 0 25%; 4076 flex:0 0 25%; 4077 max-width:25% 4078 } 4079 .col-lg-4{ 4080 -webkit-box-flex:0; 4081 -ms-flex:0 0 33.333333%; 4082 flex:0 0 33.333333%; 4083 max-width:33.333333% 4084 } 4085 .col-lg-5{ 4086 -webkit-box-flex:0; 4087 -ms-flex:0 0 41.666667%; 4088 flex:0 0 41.666667%; 4089 max-width:41.666667% 4090 } 4091 .col-lg-6{ 4092 -webkit-box-flex:0; 4093 -ms-flex:0 0 50%; 4094 flex:0 0 50%; 4095 max-width:50% 4096 } 4097 .col-lg-7{ 4098 -webkit-box-flex:0; 4099 -ms-flex:0 0 58.333333%; 4100 flex:0 0 58.333333%; 4101 max-width:58.333333% 4102 } 4103 .col-lg-8{ 4104 -webkit-box-flex:0; 4105 -ms-flex:0 0 66.666667%; 4106 flex:0 0 66.666667%; 4107 max-width:66.666667% 4108 } 4109 .col-lg-9{ 4110 -webkit-box-flex:0; 4111 -ms-flex:0 0 75%; 4112 flex:0 0 75%; 4113 max-width:75% 4114 } 4115 .col-lg-10{ 4116 -webkit-box-flex:0; 4117 -ms-flex:0 0 83.333333%; 4118 flex:0 0 83.333333%; 4119 max-width:83.333333% 4120 } 4121 .col-lg-11{ 4122 -webkit-box-flex:0; 4123 -ms-flex:0 0 91.666667%; 4124 flex:0 0 91.666667%; 4125 max-width:91.666667% 4126 } 4127 .col-lg-12{ 4128 -webkit-box-flex:0; 4129 -ms-flex:0 0 100%; 4130 flex:0 0 100%; 4131 max-width:100% 4132 } 4133 .order-lg-first{ 4134 -webkit-box-ordinal-group:0; 4135 -ms-flex-order:-1; 4136 order:-1 4137 } 4138 .order-lg-last{ 4139 -webkit-box-ordinal-group:14; 4140 -ms-flex-order:13; 4141 order:13 4142 } 4143 .order-lg-0{ 4144 -webkit-box-ordinal-group:1; 4145 -ms-flex-order:0; 4146 order:0 4147 } 4148 .order-lg-1{ 4149 -webkit-box-ordinal-group:2; 4150 -ms-flex-order:1; 4151 order:1 4152 } 4153 .order-lg-2{ 4154 -webkit-box-ordinal-group:3; 4155 -ms-flex-order:2; 4156 order:2 4157 } 4158 .order-lg-3{ 4159 -webkit-box-ordinal-group:4; 4160 -ms-flex-order:3; 4161 order:3 4162 } 4163 .order-lg-4{ 4164 -webkit-box-ordinal-group:5; 4165 -ms-flex-order:4; 4166 order:4 4167 } 4168 .order-lg-5{ 4169 -webkit-box-ordinal-group:6; 4170 -ms-flex-order:5; 4171 order:5 4172 } 4173 .order-lg-6{ 4174 -webkit-box-ordinal-group:7; 4175 -ms-flex-order:6; 4176 order:6 4177 } 4178 .order-lg-7{ 4179 -webkit-box-ordinal-group:8; 4180 -ms-flex-order:7; 4181 order:7 4182 } 4183 .order-lg-8{ 4184 -webkit-box-ordinal-group:9; 4185 -ms-flex-order:8; 4186 order:8 4187 } 4188 .order-lg-9{ 4189 -webkit-box-ordinal-group:10; 4190 -ms-flex-order:9; 4191 order:9 4192 } 4193 .order-lg-10{ 4194 -webkit-box-ordinal-group:11; 4195 -ms-flex-order:10; 4196 order:10 4197 } 4198 .order-lg-11{ 4199 -webkit-box-ordinal-group:12; 4200 -ms-flex-order:11; 4201 order:11 4202 } 4203 .order-lg-12{ 4204 -webkit-box-ordinal-group:13; 4205 -ms-flex-order:12; 4206 order:12 4207 } 4208 .offset-lg-0{ 4209 margin-left:0 4210 } 4211 .offset-lg-1{ 4212 margin-left:8.333333% 4213 } 4214 .offset-lg-2{ 4215 margin-left:16.666667% 4216 } 4217 .offset-lg-3{ 4218 margin-left:25% 4219 } 4220 .offset-lg-4{ 4221 margin-left:33.333333% 4222 } 4223 .offset-lg-5{ 4224 margin-left:41.666667% 4225 } 4226 .offset-lg-6{ 4227 margin-left:50% 4228 } 4229 .offset-lg-7{ 4230 margin-left:58.333333% 4231 } 4232 .offset-lg-8{ 4233 margin-left:66.666667% 4234 } 4235 .offset-lg-9{ 4236 margin-left:75% 4237 } 4238 .offset-lg-10{ 4239 margin-left:83.333333% 4240 } 4241 .offset-lg-11{ 4242 margin-left:91.666667% 4243 } 4244 4245} 4246@media (min-width:1200px){ 4247 .col-xl{ 4248 -ms-flex-preferred-size:0; 4249 flex-basis:0; 4250 -webkit-box-flex:1; 4251 -ms-flex-positive:1; 4252 flex-grow:1; 4253 max-width:100% 4254 } 4255 .col-xl-auto{ 4256 -webkit-box-flex:0; 4257 -ms-flex:0 0 auto; 4258 flex:0 0 auto; 4259 width:auto; 4260 max-width:none 4261 } 4262 .col-xl-1{ 4263 -webkit-box-flex:0; 4264 -ms-flex:0 0 8.333333%; 4265 flex:0 0 8.333333%; 4266 max-width:8.333333% 4267 } 4268 .col-xl-2{ 4269 -webkit-box-flex:0; 4270 -ms-flex:0 0 16.666667%; 4271 flex:0 0 16.666667%; 4272 max-width:16.666667% 4273 } 4274 .col-xl-3{ 4275 -webkit-box-flex:0; 4276 -ms-flex:0 0 25%; 4277 flex:0 0 25%; 4278 max-width:25% 4279 } 4280 .col-xl-4{ 4281 -webkit-box-flex:0; 4282 -ms-flex:0 0 33.333333%; 4283 flex:0 0 33.333333%; 4284 max-width:33.333333% 4285 } 4286 .col-xl-5{ 4287 -webkit-box-flex:0; 4288 -ms-flex:0 0 41.666667%; 4289 flex:0 0 41.666667%; 4290 max-width:41.666667% 4291 } 4292 .col-xl-6{ 4293 -webkit-box-flex:0; 4294 -ms-flex:0 0 50%; 4295 flex:0 0 50%; 4296 max-width:50% 4297 } 4298 .col-xl-7{ 4299 -webkit-box-flex:0; 4300 -ms-flex:0 0 58.333333%; 4301 flex:0 0 58.333333%; 4302 max-width:58.333333% 4303 } 4304 .col-xl-8{ 4305 -webkit-box-flex:0; 4306 -ms-flex:0 0 66.666667%; 4307 flex:0 0 66.666667%; 4308 max-width:66.666667% 4309 } 4310 .col-xl-9{ 4311 -webkit-box-flex:0; 4312 -ms-flex:0 0 75%; 4313 flex:0 0 75%; 4314 max-width:75% 4315 } 4316 .col-xl-10{ 4317 -webkit-box-flex:0; 4318 -ms-flex:0 0 83.333333%; 4319 flex:0 0 83.333333%; 4320 max-width:83.333333% 4321 } 4322 .col-xl-11{ 4323 -webkit-box-flex:0; 4324 -ms-flex:0 0 91.666667%; 4325 flex:0 0 91.666667%; 4326 max-width:91.666667% 4327 } 4328 .col-xl-12{ 4329 -webkit-box-flex:0; 4330 -ms-flex:0 0 100%; 4331 flex:0 0 100%; 4332 max-width:100% 4333 } 4334 .order-xl-first{ 4335 -webkit-box-ordinal-group:0; 4336 -ms-flex-order:-1; 4337 order:-1 4338 } 4339 .order-xl-last{ 4340 -webkit-box-ordinal-group:14; 4341 -ms-flex-order:13; 4342 order:13 4343 } 4344 .order-xl-0{ 4345 -webkit-box-ordinal-group:1; 4346 -ms-flex-order:0; 4347 order:0 4348 } 4349 .order-xl-1{ 4350 -webkit-box-ordinal-group:2; 4351 -ms-flex-order:1; 4352 order:1 4353 } 4354 .order-xl-2{ 4355 -webkit-box-ordinal-group:3; 4356 -ms-flex-order:2; 4357 order:2 4358 } 4359 .order-xl-3{ 4360 -webkit-box-ordinal-group:4; 4361 -ms-flex-order:3; 4362 order:3 4363 } 4364 .order-xl-4{ 4365 -webkit-box-ordinal-group:5; 4366 -ms-flex-order:4; 4367 order:4 4368 } 4369 .order-xl-5{ 4370 -webkit-box-ordinal-group:6; 4371 -ms-flex-order:5; 4372 order:5 4373 } 4374 .order-xl-6{ 4375 -webkit-box-ordinal-group:7; 4376 -ms-flex-order:6; 4377 order:6 4378 } 4379 .order-xl-7{ 4380 -webkit-box-ordinal-group:8; 4381 -ms-flex-order:7; 4382 order:7 4383 } 4384 .order-xl-8{ 4385 -webkit-box-ordinal-group:9; 4386 -ms-flex-order:8; 4387 order:8 4388 } 4389 .order-xl-9{ 4390 -webkit-box-ordinal-group:10; 4391 -ms-flex-order:9; 4392 order:9 4393 } 4394 .order-xl-10{ 4395 -webkit-box-ordinal-group:11; 4396 -ms-flex-order:10; 4397 order:10 4398 } 4399 .order-xl-11{ 4400 -webkit-box-ordinal-group:12; 4401 -ms-flex-order:11; 4402 order:11 4403 } 4404 .order-xl-12{ 4405 -webkit-box-ordinal-group:13; 4406 -ms-flex-order:12; 4407 order:12 4408 } 4409 .offset-xl-0{ 4410 margin-left:0 4411 } 4412 .offset-xl-1{ 4413 margin-left:8.333333% 4414 } 4415 .offset-xl-2{ 4416 margin-left:16.666667% 4417 } 4418 .offset-xl-3{ 4419 margin-left:25% 4420 } 4421 .offset-xl-4{ 4422 margin-left:33.333333% 4423 } 4424 .offset-xl-5{ 4425 margin-left:41.666667% 4426 } 4427 .offset-xl-6{ 4428 margin-left:50% 4429 } 4430 .offset-xl-7{ 4431 margin-left:58.333333% 4432 } 4433 .offset-xl-8{ 4434 margin-left:66.666667% 4435 } 4436 .offset-xl-9{ 4437 margin-left:75% 4438 } 4439 .offset-xl-10{ 4440 margin-left:83.333333% 4441 } 4442 .offset-xl-11{ 4443 margin-left:91.666667% 4444 } 4445 4446} 4447.d-none{ 4448 display:none!important 4449} 4450.d-inline{ 4451 display:inline!important 4452} 4453.d-inline-block{ 4454 display:inline-block!important 4455} 4456.d-block{ 4457 display:block!important 4458} 4459.d-table{ 4460 display:table!important 4461} 4462.d-table-row{ 4463 display:table-row!important 4464} 4465.d-table-cell{ 4466 display:table-cell!important 4467} 4468.d-flex{ 4469 display:-webkit-box!important; 4470 display:-ms-flexbox!important; 4471 display:flex!important 4472} 4473.d-inline-flex{ 4474 display:-webkit-inline-box!important; 4475 display:-ms-inline-flexbox!important; 4476 display:inline-flex!important 4477} 4478@media (min-width:576px){ 4479 .d-sm-none{ 4480 display:none!important 4481 } 4482 .d-sm-inline{ 4483 display:inline!important 4484 } 4485 .d-sm-inline-block{ 4486 display:inline-block!important 4487 } 4488 .d-sm-block{ 4489 display:block!important 4490 } 4491 .d-sm-table{ 4492 display:table!important 4493 } 4494 .d-sm-table-row{ 4495 display:table-row!important 4496 } 4497 .d-sm-table-cell{ 4498 display:table-cell!important 4499 } 4500 .d-sm-flex{ 4501 display:-webkit-box!important; 4502 display:-ms-flexbox!important; 4503 display:flex!important 4504 } 4505 .d-sm-inline-flex{ 4506 display:-webkit-inline-box!important; 4507 display:-ms-inline-flexbox!important; 4508 display:inline-flex!important 4509 } 4510 4511} 4512@media (min-width:768px){ 4513 .d-md-none{ 4514 display:none!important 4515 } 4516 .d-md-inline{ 4517 display:inline!important 4518 } 4519 .d-md-inline-block{ 4520 display:inline-block!important 4521 } 4522 .d-md-block{ 4523 display:block!important 4524 } 4525 .d-md-table{ 4526 display:table!important 4527 } 4528 .d-md-table-row{ 4529 display:table-row!important 4530 } 4531 .d-md-table-cell{ 4532 display:table-cell!important 4533 } 4534 .d-md-flex{ 4535 display:-webkit-box!important; 4536 display:-ms-flexbox!important; 4537 display:flex!important 4538 } 4539 .d-md-inline-flex{ 4540 display:-webkit-inline-box!important; 4541 display:-ms-inline-flexbox!important; 4542 display:inline-flex!important 4543 } 4544 4545} 4546@media (min-width:992px){ 4547 .d-lg-none{ 4548 display:none!important 4549 } 4550 .d-lg-inline{ 4551 display:inline!important 4552 } 4553 .d-lg-inline-block{ 4554 display:inline-block!important 4555 } 4556 .d-lg-block{ 4557 display:block!important 4558 } 4559 .d-lg-table{ 4560 display:table!important 4561 } 4562 .d-lg-table-row{ 4563 display:table-row!important 4564 } 4565 .d-lg-table-cell{ 4566 display:table-cell!important 4567 } 4568 .d-lg-flex{ 4569 display:-webkit-box!important; 4570 display:-ms-flexbox!important; 4571 display:flex!important 4572 } 4573 .d-lg-inline-flex{ 4574 display:-webkit-inline-box!important; 4575 display:-ms-inline-flexbox!important; 4576 display:inline-flex!important 4577 } 4578 4579} 4580@media (min-width:1200px){ 4581 .d-xl-none{ 4582 display:none!important 4583 } 4584 .d-xl-inline{ 4585 display:inline!important 4586 } 4587 .d-xl-inline-block{ 4588 display:inline-block!important 4589 } 4590 .d-xl-block{ 4591 display:block!important 4592 } 4593 .d-xl-table{ 4594 display:table!important 4595 } 4596 .d-xl-table-row{ 4597 display:table-row!important 4598 } 4599 .d-xl-table-cell{ 4600 display:table-cell!important 4601 } 4602 .d-xl-flex{ 4603 display:-webkit-box!important; 4604 display:-ms-flexbox!important; 4605 display:flex!important 4606 } 4607 .d-xl-inline-flex{ 4608 display:-webkit-inline-box!important; 4609 display:-ms-inline-flexbox!important; 4610 display:inline-flex!important 4611 } 4612 4613} 4614@media print{ 4615 .d-print-none{ 4616 display:none!important 4617 } 4618 .d-print-inline{ 4619 display:inline!important 4620 } 4621 .d-print-inline-block{ 4622 display:inline-block!important 4623 } 4624 .d-print-block{ 4625 display:block!important 4626 } 4627 .d-print-table{ 4628 display:table!important 4629 } 4630 .d-print-table-row{ 4631 display:table-row!important 4632 } 4633 .d-print-table-cell{ 4634 display:table-cell!important 4635 } 4636 .d-print-flex{ 4637 display:-webkit-box!important; 4638 display:-ms-flexbox!important; 4639 display:flex!important 4640 } 4641 .d-print-inline-flex{ 4642 display:-webkit-inline-box!important; 4643 display:-ms-inline-flexbox!important; 4644 display:inline-flex!important 4645 } 4646 4647} 4648.flex-row{ 4649 -webkit-box-orient:horizontal!important; 4650 -webkit-box-direction:normal!important; 4651 -ms-flex-direction:row!important; 4652 flex-direction:row!important 4653} 4654.flex-column{ 4655 -webkit-box-orient:vertical!important; 4656 -webkit-box-direction:normal!important; 4657 -ms-flex-direction:column!important; 4658 flex-direction:column!important 4659} 4660.flex-row-reverse{ 4661 -webkit-box-orient:horizontal!important; 4662 -webkit-box-direction:reverse!important; 4663 -ms-flex-direction:row-reverse!important; 4664 flex-direction:row-reverse!important 4665} 4666.flex-column-reverse{ 4667 -webkit-box-orient:vertical!important; 4668 -webkit-box-direction:reverse!important; 4669 -ms-flex-direction:column-reverse!important; 4670 flex-direction:column-reverse!important 4671} 4672.flex-wrap{ 4673 -ms-flex-wrap:wrap!important; 4674 flex-wrap:wrap!important 4675} 4676.flex-nowrap{ 4677 -ms-flex-wrap:nowrap!important; 4678 flex-wrap:nowrap!important 4679} 4680.flex-wrap-reverse{ 4681 -ms-flex-wrap:wrap-reverse!important; 4682 flex-wrap:wrap-reverse!important 4683} 4684.justify-content-start{ 4685 -webkit-box-pack:start!important; 4686 -ms-flex-pack:start!important; 4687 justify-content:flex-start!important 4688} 4689.justify-content-end{ 4690 -webkit-box-pack:end!important; 4691 -ms-flex-pack:end!important; 4692 justify-content:flex-end!important 4693} 4694.justify-content-center{ 4695 -webkit-box-pack:center!important; 4696 -ms-flex-pack:center!important; 4697 justify-content:center!important 4698} 4699.justify-content-between{ 4700 -webkit-box-pack:justify!important; 4701 -ms-flex-pack:justify!important; 4702 justify-content:space-between!important 4703} 4704.justify-content-around{ 4705 -ms-flex-pack:distribute!important; 4706 justify-content:space-around!important 4707} 4708.align-items-start{ 4709 -webkit-box-align:start!important; 4710 -ms-flex-align:start!important;
4711 align-items:flex-start!important 4712} 4713.align-items-end{ 4714 -webkit-box-align:end!important; 4715 -ms-flex-align:end!important; 4716 align-items:flex-end!important 4717} 4718.align-items-center{ 4719 -webkit-box-align:center!important; 4720 -ms-flex-align:center!important; 4721 align-items:center!important 4722} 4723.align-items-baseline{ 4724 -webkit-box-align:baseline!important; 4725 -ms-flex-align:baseline!important; 4726 align-items:baseline!important 4727} 4728.align-items-stretch{ 4729 -webkit-box-align:stretch!important; 4730 -ms-flex-align:stretch!important; 4731 align-items:stretch!important 4732} 4733.align-content-start{ 4734 -ms-flex-line-pack:start!important; 4735 align-content:flex-start!important 4736} 4737.align-content-end{ 4738 -ms-flex-line-pack:end!important; 4739 align-content:flex-end!important 4740} 4741.align-content-center{ 4742 -ms-flex-line-pack:center!important; 4743 align-content:center!important 4744} 4745.align-content-between{ 4746 -ms-flex-line-pack:justify!important; 4747 align-content:space-between!important 4748} 4749.align-content-around{ 4750 -ms-flex-line-pack:distribute!important; 4751 align-content:space-around!important 4752} 4753.align-content-stretch{ 4754 -ms-flex-line-pack:stretch!important; 4755 align-content:stretch!important 4756} 4757.align-self-auto{ 4758 -ms-flex-item-align:auto!important; 4759 align-self:auto!important 4760} 4761.align-self-start{ 4762 -ms-flex-item-align:start!important; 4763 align-self:flex-start!important 4764} 4765.align-self-end{ 4766 -ms-flex-item-align:end!important; 4767 align-self:flex-end!important 4768} 4769.align-self-center{ 4770 -ms-flex-item-align:center!important; 4771 align-self:center!important 4772} 4773.align-self-baseline{ 4774 -ms-flex-item-align:baseline!important; 4775 align-self:baseline!important 4776} 4777.align-self-stretch{ 4778 -ms-flex-item-align:stretch!important; 4779 align-self:stretch!important 4780} 4781@media (min-width:576px){ 4782 .flex-sm-row{ 4783 -webkit-box-orient:horizontal!important; 4784 -webkit-box-direction:normal!important; 4785 -ms-flex-direction:row!important; 4786 flex-direction:row!important 4787 } 4788 .flex-sm-column{ 4789 -webkit-box-orient:vertical!important; 4790 -webkit-box-direction:normal!important; 4791 -ms-flex-direction:column!important; 4792 flex-direction:column!important 4793 } 4794 .flex-sm-row-reverse{ 4795 -webkit-box-orient:horizontal!important; 4796 -webkit-box-direction:reverse!important; 4797 -ms-flex-direction:row-reverse!important; 4798 flex-direction:row-reverse!important 4799 } 4800 .flex-sm-column-reverse{ 4801 -webkit-box-orient:vertical!important; 4802 -webkit-box-direction:reverse!important; 4803 -ms-flex-direction:column-reverse!important; 4804 flex-direction:column-reverse!important 4805 } 4806 .flex-sm-wrap{ 4807 -ms-flex-wrap:wrap!important; 4808 flex-wrap:wrap!important 4809 } 4810 .flex-sm-nowrap{ 4811 -ms-flex-wrap:nowrap!important; 4812 flex-wrap:nowrap!important 4813 } 4814 .flex-sm-wrap-reverse{ 4815 -ms-flex-wrap:wrap-reverse!important; 4816 flex-wrap:wrap-reverse!important 4817 } 4818 .justify-content-sm-start{ 4819 -webkit-box-pack:start!important; 4820 -ms-flex-pack:start!important; 4821 justify-content:flex-start!important 4822 } 4823 .justify-content-sm-end{ 4824 -webkit-box-pack:end!important; 4825 -ms-flex-pack:end!important; 4826 justify-content:flex-end!important 4827 } 4828 .justify-content-sm-center{ 4829 -webkit-box-pack:center!important; 4830 -ms-flex-pack:center!important; 4831 justify-content:center!important 4832 } 4833 .justify-content-sm-between{ 4834 -webkit-box-pack:justify!important; 4835 -ms-flex-pack:justify!important; 4836 justify-content:space-between!important 4837 } 4838 .justify-content-sm-around{ 4839 -ms-flex-pack:distribute!important; 4840 justify-content:space-around!important 4841 } 4842 .align-items-sm-start{ 4843 -webkit-box-align:start!important; 4844 -ms-flex-align:start!important; 4845 align-items:flex-start!important 4846 } 4847 .align-items-sm-end{ 4848 -webkit-box-align:end!important; 4849 -ms-flex-align:end!important; 4850 align-items:flex-end!important 4851 } 4852 .align-items-sm-center{ 4853 -webkit-box-align:center!important; 4854 -ms-flex-align:center!important; 4855 align-items:center!important 4856 } 4857 .align-items-sm-baseline{ 4858 -webkit-box-align:baseline!important; 4859 -ms-flex-align:baseline!important; 4860 align-items:baseline!important 4861 } 4862 .align-items-sm-stretch{ 4863 -webkit-box-align:stretch!important; 4864 -ms-flex-align:stretch!important; 4865 align-items:stretch!important 4866 } 4867 .align-content-sm-start{ 4868 -ms-flex-line-pack:start!important; 4869 align-content:flex-start!important 4870 } 4871 .align-content-sm-end{ 4872 -ms-flex-line-pack:end!important; 4873 align-content:flex-end!important 4874 } 4875 .align-content-sm-center{ 4876 -ms-flex-line-pack:center!important; 4877 align-content:center!important 4878 } 4879 .align-content-sm-between{ 4880 -ms-flex-line-pack:justify!important; 4881 align-content:space-between!important 4882 } 4883 .align-content-sm-around{ 4884 -ms-flex-line-pack:distribute!important; 4885 align-content:space-around!important 4886 } 4887 .align-content-sm-stretch{ 4888 -ms-flex-line-pack:stretch!important; 4889 align-content:stretch!important 4890 } 4891 .align-self-sm-auto{ 4892 -ms-flex-item-align:auto!important; 4893 align-self:auto!important 4894 } 4895 .align-self-sm-start{ 4896 -ms-flex-item-align:start!important; 4897 align-self:flex-start!important 4898 } 4899 .align-self-sm-end{ 4900 -ms-flex-item-align:end!important; 4901 align-self:flex-end!important 4902 } 4903 .align-self-sm-center{ 4904 -ms-flex-item-align:center!important; 4905 align-self:center!important 4906 } 4907 .align-self-sm-baseline{ 4908 -ms-flex-item-align:baseline!important; 4909 align-self:baseline!important 4910 } 4911 .align-self-sm-stretch{ 4912 -ms-flex-item-align:stretch!important; 4913 align-self:stretch!important 4914 } 4915 4916} 4917@media (min-width:768px){ 4918 .flex-md-row{ 4919 -webkit-box-orient:horizontal!important; 4920 -webkit-box-direction:normal!important; 4921 -ms-flex-direction:row!important; 4922 flex-direction:row!important 4923 } 4924 .flex-md-column{ 4925 -webkit-box-orient:vertical!important; 4926 -webkit-box-direction:normal!important; 4927 -ms-flex-direction:column!important; 4928 flex-direction:column!important 4929 } 4930 .flex-md-row-reverse{ 4931 -webkit-box-orient:horizontal!important; 4932 -webkit-box-direction:reverse!important; 4933 -ms-flex-direction:row-reverse!important; 4934 flex-direction:row-reverse!important 4935 } 4936 .flex-md-column-reverse{ 4937 -webkit-box-orient:vertical!important; 4938 -webkit-box-direction:reverse!important; 4939 -ms-flex-direction:column-reverse!important; 4940 flex-direction:column-reverse!important 4941 } 4942 .flex-md-wrap{ 4943 -ms-flex-wrap:wrap!important; 4944 flex-wrap:wrap!important 4945 } 4946 .flex-md-nowrap{ 4947 -ms-flex-wrap:nowrap!important; 4948 flex-wrap:nowrap!important 4949 } 4950 .flex-md-wrap-reverse{ 4951 -ms-flex-wrap:wrap-reverse!important; 4952 flex-wrap:wrap-reverse!important 4953 } 4954 .justify-content-md-start{ 4955 -webkit-box-pack:start!important; 4956 -ms-flex-pack:start!important; 4957 justify-content:flex-start!important 4958 } 4959 .justify-content-md-end{ 4960 -webkit-box-pack:end!important; 4961 -ms-flex-pack:end!important; 4962 justify-content:flex-end!important 4963 } 4964 .justify-content-md-center{ 4965 -webkit-box-pack:center!important; 4966 -ms-flex-pack:center!important; 4967 justify-content:center!important 4968 } 4969 .justify-content-md-between{ 4970 -webkit-box-pack:justify!important; 4971 -ms-flex-pack:justify!important; 4972 justify-content:space-between!important 4973 } 4974 .justify-content-md-around{ 4975 -ms-flex-pack:distribute!important; 4976 justify-content:space-around!important 4977 } 4978 .align-items-md-start{ 4979 -webkit-box-align:start!important; 4980 -ms-flex-align:start!important; 4981 align-items:flex-start!important 4982 } 4983 .align-items-md-end{ 4984 -webkit-box-align:end!important; 4985 -ms-flex-align:end!important; 4986 align-items:flex-end!important 4987 } 4988 .align-items-md-center{ 4989 -webkit-box-align:center!important; 4990 -ms-flex-align:center!important; 4991 align-items:center!important 4992 } 4993 .align-items-md-baseline{ 4994 -webkit-box-align:baseline!important; 4995 -ms-flex-align:baseline!important; 4996 align-items:baseline!important 4997 } 4998 .align-items-md-stretch{ 4999 -webkit-box-align:stretch!important; 5000 -ms-flex-align:stretch!important; 5001 align-items:stretch!important 5002 } 5003 .align-content-md-start{ 5004 -ms-flex-line-pack:start!important; 5005 align-content:flex-start!important 5006 } 5007 .align-content-md-end{ 5008 -ms-flex-line-pack:end!important; 5009 align-content:flex-end!important 5010 } 5011 .align-content-md-center{ 5012 -ms-flex-line-pack:center!important; 5013 align-content:center!important 5014 } 5015 .align-content-md-between{ 5016 -ms-flex-line-pack:justify!important; 5017 align-content:space-between!important 5018 } 5019 .align-content-md-around{ 5020 -ms-flex-line-pack:distribute!important; 5021 align-content:space-around!important 5022 } 5023 .align-content-md-stretch{ 5024 -ms-flex-line-pack:stretch!important; 5025 align-content:stretch!important 5026 } 5027 .align-self-md-auto{ 5028 -ms-flex-item-align:auto!important; 5029 align-self:auto!important 5030 } 5031 .align-self-md-start{ 5032 -ms-flex-item-align:start!important; 5033 align-self:flex-start!important 5034 } 5035 .align-self-md-end{ 5036 -ms-flex-item-align:end!important; 5037 align-self:flex-end!important 5038 } 5039 .align-self-md-center{ 5040 -ms-flex-item-align:center!important; 5041 align-self:center!important 5042 } 5043 .align-self-md-baseline{ 5044 -ms-flex-item-align:baseline!important; 5045 align-self:baseline!important 5046 } 5047 .align-self-md-stretch{ 5048 -ms-flex-item-align:stretch!important; 5049 align-self:stretch!important 5050 } 5051 5052} 5053@media (min-width:992px){ 5054 .flex-lg-row{ 5055 -webkit-box-orient:horizontal!important; 5056 -webkit-box-direction:normal!important; 5057 -ms-flex-direction:row!important; 5058 flex-direction:row!important 5059 } 5060 .flex-lg-column{ 5061 -webkit-box-orient:vertical!important; 5062 -webkit-box-direction:normal!important; 5063 -ms-flex-direction:column!important; 5064 flex-direction:column!important 5065 } 5066 .flex-lg-row-reverse{ 5067 -webkit-box-orient:horizontal!important; 5068 -webkit-box-direction:reverse!important; 5069 -ms-flex-direction:row-reverse!important; 5070 flex-direction:row-reverse!important 5071 } 5072 .flex-lg-column-reverse{ 5073 -webkit-box-orient:vertical!important; 5074 -webkit-box-direction:reverse!important; 5075 -ms-flex-direction:column-reverse!important; 5076 flex-direction:column-reverse!important 5077 } 5078 .flex-lg-wrap{ 5079 -ms-flex-wrap:wrap!important; 5080 flex-wrap:wrap!important 5081 } 5082 .flex-lg-nowrap{ 5083 -ms-flex-wrap:nowrap!important; 5084 flex-wrap:nowrap!important 5085 } 5086 .flex-lg-wrap-reverse{ 5087 -ms-flex-wrap:wrap-reverse!important; 5088 flex-wrap:wrap-reverse!important 5089 } 5090 .justify-content-lg-start{ 5091 -webkit-box-pack:start!important; 5092 -ms-flex-pack:start!important; 5093 justify-content:flex-start!important 5094 } 5095 .justify-content-lg-end{ 5096 -webkit-box-pack:end!important; 5097 -ms-flex-pack:end!important; 5098 justify-content:flex-end!important 5099 } 5100 .justify-content-lg-center{ 5101 -webkit-box-pack:center!important; 5102 -ms-flex-pack:center!important; 5103 justify-content:center!important 5104 } 5105 .justify-content-lg-between{ 5106 -webkit-box-pack:justify!important; 5107 -ms-flex-pack:justify!important; 5108 justify-content:space-between!important 5109 } 5110 .justify-content-lg-around{ 5111 -ms-flex-pack:distribute!important; 5112 justify-content:space-around!important 5113 } 5114 .align-items-lg-start{ 5115 -webkit-box-align:start!important; 5116 -ms-flex-align:start!important; 5117 align-items:flex-start!important 5118 } 5119 .align-items-lg-end{ 5120 -webkit-box-align:end!important; 5121 -ms-flex-align:end!important; 5122 align-items:flex-end!important 5123 } 5124 .align-items-lg-center{ 5125 -webkit-box-align:center!important; 5126 -ms-flex-align:center!important; 5127 align-items:center!important 5128 } 5129 .align-items-lg-baseline{ 5130 -webkit-box-align:baseline!important; 5131 -ms-flex-align:baseline!important; 5132 align-items:baseline!important 5133 } 5134 .align-items-lg-stretch{ 5135 -webkit-box-align:stretch!important; 5136 -ms-flex-align:stretch!important; 5137 align-items:stretch!important 5138 } 5139 .align-content-lg-start{ 5140 -ms-flex-line-pack:start!important; 5141 align-content:flex-start!important 5142 } 5143 .align-content-lg-end{ 5144 -ms-flex-line-pack:end!important; 5145 align-content:flex-end!important 5146 } 5147 .align-content-lg-center{ 5148 -ms-flex-line-pack:center!important; 5149 align-content:center!important 5150 } 5151 .align-content-lg-between{ 5152 -ms-flex-line-pack:justify!important; 5153 align-content:space-between!important 5154 } 5155 .align-content-lg-around{ 5156 -ms-flex-line-pack:distribute!important; 5157 align-content:space-around!important 5158 } 5159 .align-content-lg-stretch{ 5160 -ms-flex-line-pack:stretch!important; 5161 align-content:stretch!important 5162 } 5163 .align-self-lg-auto{ 5164 -ms-flex-item-align:auto!important; 5165 align-self:auto!important 5166 } 5167 .align-self-lg-start{ 5168 -ms-flex-item-align:start!important; 5169 align-self:flex-start!important 5170 } 5171 .align-self-lg-end{ 5172 -ms-flex-item-align:end!important; 5173 align-self:flex-end!important 5174 } 5175 .align-self-lg-center{ 5176 -ms-flex-item-align:center!important; 5177 align-self:center!important 5178 } 5179 .align-self-lg-baseline{ 5180 -ms-flex-item-align:baseline!important; 5181 align-self:baseline!important 5182 } 5183 .align-self-lg-stretch{ 5184 -ms-flex-item-align:stretch!important; 5185 align-self:stretch!important 5186 } 5187 5188} 5189@media (min-width:1200px){ 5190 .flex-xl-row{ 5191 -webkit-box-orient:horizontal!important; 5192 -webkit-box-direction:normal!important; 5193 -ms-flex-direction:row!important; 5194 flex-direction:row!important 5195 } 5196 .flex-xl-column{ 5197 -webkit-box-orient:vertical!important; 5198 -webkit-box-direction:normal!important; 5199 -ms-flex-direction:column!important; 5200 flex-direction:column!important 5201 } 5202 .flex-xl-row-reverse{ 5203 -webkit-box-orient:horizontal!important; 5204 -webkit-box-direction:reverse!important; 5205 -ms-flex-direction:row-reverse!important; 5206 flex-direction:row-reverse!important 5207 } 5208 .flex-xl-column-reverse{ 5209 -webkit-box-orient:vertical!important; 5210 -webkit-box-direction:reverse!important; 5211 -ms-flex-direction:column-reverse!important; 5212 flex-direction:column-reverse!important 5213 } 5214 .flex-xl-wrap{ 5215 -ms-flex-wrap:wrap!important; 5216 flex-wrap:wrap!important 5217 } 5218 .flex-xl-nowrap{ 5219 -ms-flex-wrap:nowrap!important; 5220 flex-wrap:nowrap!important 5221 } 5222 .flex-xl-wrap-reverse{ 5223 -ms-flex-wrap:wrap-reverse!important; 5224 flex-wrap:wrap-reverse!important 5225 } 5226 .justify-content-xl-start{ 5227 -webkit-box-pack:start!important; 5228 -ms-flex-pack:start!important; 5229 justify-content:flex-start!important 5230 } 5231 .justify-content-xl-end{ 5232 -webkit-box-pack:end!important; 5233
5233 -ms-flex-pack:end!important; 5234 justify-content:flex-end!important 5235 } 5236 .justify-content-xl-center{ 5237 -webkit-box-pack:center!important; 5238 -ms-flex-pack:center!important; 5239 justify-content:center!important 5240 } 5241 .justify-content-xl-between{ 5242 -webkit-box-pack:justify!important; 5243 -ms-flex-pack:justify!important; 5244 justify-content:space-between!important 5245 } 5246 .justify-content-xl-around{ 5247 -ms-flex-pack:distribute!important; 5248 justify-content:space-around!important 5249 } 5250 .align-items-xl-start{ 5251 -webkit-box-align:start!important; 5252 -ms-flex-align:start!important; 5253 align-items:flex-start!important 5254 } 5255 .align-items-xl-end{ 5256 -webkit-box-align:end!important; 5257 -ms-flex-align:end!important; 5258 align-items:flex-end!important 5259 } 5260 .align-items-xl-center{ 5261 -webkit-box-align:center!important; 5262 -ms-flex-align:center!important; 5263 align-items:center!important 5264 } 5265 .align-items-xl-baseline{ 5266 -webkit-box-align:baseline!important; 5267 -ms-flex-align:baseline!important; 5268 align-items:baseline!important 5269 } 5270 .align-items-xl-stretch{ 5271 -webkit-box-align:stretch!important; 5272 -ms-flex-align:stretch!important; 5273 align-items:stretch!important 5274 } 5275 .align-content-xl-start{ 5276 -ms-flex-line-pack:start!important; 5277 align-content:flex-start!important 5278 } 5279 .align-content-xl-end{ 5280 -ms-flex-line-pack:end!important; 5281 align-content:flex-end!important 5282 } 5283 .align-content-xl-center{ 5284 -ms-flex-line-pack:center!important; 5285 align-content:center!important 5286 } 5287 .align-content-xl-between{ 5288 -ms-flex-line-pack:justify!important; 5289 align-content:space-between!important 5290 } 5291 .align-content-xl-around{ 5292 -ms-flex-line-pack:distribute!important; 5293 align-content:space-around!important 5294 } 5295 .align-content-xl-stretch{ 5296 -ms-flex-line-pack:stretch!important; 5297 align-content:stretch!important 5298 } 5299 .align-self-xl-auto{ 5300 -ms-flex-item-align:auto!important; 5301 align-self:auto!important 5302 } 5303 .align-self-xl-start{ 5304 -ms-flex-item-align:start!important; 5305 align-self:flex-start!important 5306 } 5307 .align-self-xl-end{ 5308 -ms-flex-item-align:end!important; 5309 align-self:flex-end!important 5310 } 5311 .align-self-xl-center{ 5312 -ms-flex-item-align:center!important; 5313 align-self:center!important 5314 } 5315 .align-self-xl-baseline{ 5316 -ms-flex-item-align:baseline!important; 5317 align-self:baseline!important 5318 } 5319 .align-self-xl-stretch{ 5320 -ms-flex-item-align:stretch!important; 5321 align-self:stretch!important 5322 } 5323 5324} 5325::after,::before{ 5326 box-sizing:border-box 5327} 5328html{ 5329 font-family:sans-serif; 5330 line-height:1.15; 5331 -webkit-text-size-adjust:100%; 5332 -ms-text-size-adjust:100%; 5333 -ms-overflow-style:scrollbar; 5334 -webkit-tap-highlight-color:transparent 5335} 5336@-ms-viewport{ 5337 width:device-width 5338} 5339article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{ 5340 display:block 5341} 5342body{ 5343 margin:0; 5344 font-size:1rem; 5345 line-height:1.5; 5346 color:#212529; 5347 text-align:left; 5348 background-color:#fff 5349} 5350[tabindex="-1"]:focus{ 5351 outline:0!important 5352} 5353hr{ 5354 box-sizing:content-box; 5355 height:0; 5356 overflow:visible 5357} 5358h1,h2,h3,h4,h5,h6{ 5359 margin-top:0; 5360 5361} 5362p{ 5363 margin-top:0; 5364 margin-bottom:1rem 5365} 5366abbr[data-original-title],abbr[title]{ 5367 text-decoration:underline; 5368 -webkit-text-decoration:underline dotted; 5369 text-decoration:underline dotted; 5370 cursor:help; 5371 border-bottom:0 5372} 5373address{ 5374 margin-bottom:1rem; 5375 font-style:normal; 5376 line-height:inherit 5377} 5378dl,ol,ul{ 5379 margin-top:0; 5380 margin-bottom:1rem 5381} 5382ol ol,ol ul,ul ol,ul ul{ 5383 margin-bottom:0 5384} 5385dt{ 5386 font-weight:700 5387} 5388dd{ 5389 margin-bottom:.5rem; 5390 margin-left:0 5391} 5392blockquote{ 5393 margin:0 0 1rem 5394} 5395dfn{ 5396 font-style:italic 5397} 5398b,small{ 5399 font-size:80% 5400} 5401sub,sup{ 5402 position:relative; 5403 font-size:75%; 5404 line-height:0; 5405 vertical-align:baseline 5406} 5407sub{ 5408 bottom:-.25em 5409} 5410sup{ 5411 top:-.5em 5412} 5413a:not([href]):not([tabindex]){ 5414 color:inherit; 5415 text-decoration:none 5416} 5417a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{ 5418 color:inherit; 5419 text-decoration:none 5420} 5421a:not([href]):not([tabindex]):focus{ 5422 outline:0 5423}
5424code,kbd,pre,samp{ 5425 font-family:monospace,monospace; 5426 font-size:1em 5427} 5428pre{ 5429 margin-top:0; 5430 margin-bottom:1rem; 5431 overflow:auto; 5432 -ms-overflow-style:scrollbar 5433} 5434figure{ 5435 margin:0 0 1rem 5436} 5437img{ 5438 vertical-align:middle; 5439 border-style:none 5440} 5441svg:not(:root){ 5442 overflow:hidden 5443} 5444table{ 5445 border-collapse:collapse 5446} 5447caption{ 5448 padding-top:.75rem; 5449 padding-bottom:.75rem; 5450 color:#6c757d; 5451 text-align:left; 5452 caption-side:bottom 5453} 5454th{ 5455 text-align:inherit 5456} 5457label{ 5458 display:inline-block; 5459 margin-bottom:.5rem 5460} 5461button{ 5462 border-radius:0 5463} 5464button:focus{ 5465 outline:1px dotted; 5466 outline:5px auto -webkit-focus-ring-color 5467} 5468button,input,optgroup,select,textarea{ 5469 margin:0; 5470 font-family:inherit; 5471 font-size:inherit; 5472 line-height:inherit 5473} 5474button,input{ 5475 overflow:visible 5476} 5477button,select{ 5478 text-transform:none 5479} 5480[type=reset],[type=submit],button,html [type=button]{ 5481 -webkit-appearance:button 5482} 5483[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{ 5484 padding:0; 5485 border-style:none 5486} 5487input[type=checkbox],input[type=radio]{ 5488 box-sizing:border-box; 5489 padding:0 5490} 5491input[type=date],input[type=datetime-local],input[type=month],input[type=time]{ 5492 -webkit-appearance:listbox 5493} 5494textarea{ 5495 overflow:auto; 5496 resize:vertical 5497} 5498fieldset{ 5499 min-width:0; 5500 padding:0; 5501 margin:0; 5502 border:0 5503} 5504legend{ 5505 display:block; 5506 width:100%; 5507 max-width:100%; 5508 padding:0; 5509 margin-bottom:.5rem; 5510 font-size:1.5rem; 5511 line-height:inherit; 5512 color:inherit; 5513 white-space:normal 5514} 5515progress{ 5516 vertical-align:baseline 5517} 5518[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{ 5519 height:auto 5520} 5521[type=search]{ 5522 outline-offset:-2px; 5523 -webkit-appearance:none 5524} 5525[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{ 5526 -webkit-appearance:none 5527} 5528::-webkit-file-upload-button{ 5529 font:inherit; 5530 -webkit-appearance:button 5531} 5532output{ 5533 display:inline-block 5534} 5535summary{ 5536 display:list-item; 5537 cursor:pointer 5538} 5539template{ 5540 display:none 5541} 5542[hidden]{ 5543 display:none!important 5544} 5545.navbar{ 5546 position:relative; 5547 display:-webkit-box; 5548 display:-ms-flexbox; 5549 display:flex; 5550 -ms-flex-wrap:wrap; 5551 flex-wrap:wrap; 5552 -webkit-box-align:center; 5553 -ms-flex-align:center; 5554 align-items:center; 5555 -webkit-box-pack:justify; 5556 -ms-flex-pack:justify; 5557 justify-content:space-between; 5558 padding:.5rem 1rem 5559} 5560.navbar>.container,.navbar>.container-fluid{ 5561 display:-webkit-box; 5562 display:-ms-flexbox; 5563 display:flex; 5564 -ms-flex-wrap:wrap; 5565 flex-wrap:wrap; 5566 -webkit-box-align:center; 5567 -ms-flex-align:center; 5568 align-items:center; 5569 -webkit-box-pack:justify; 5570 -ms-flex-pack:justify; 5571 justify-content:space-between 5572} 5573.navbar-brand{ 5574 display:inline-block; 5575 padding-top:.3125rem; 5576 padding-bottom:.3125rem; 5577 margin-right:1rem; 5578 font-size:1.25rem; 5579 line-height:inherit; 5580 white-space:nowrap 5581} 5582.navbar-brand:focus,.navbar-brand:hover{ 5583 text-decoration:none 5584} 5585.navbar-nav{ 5586 display:-webkit-box; 5587 display:-ms-flexbox; 5588 display:flex; 5589 -webkit-box-orient:vertical; 5590 -webkit-box-direction:normal; 5591 -ms-flex-direction:column; 5592 flex-direction:column; 5593 padding-left:0; 5594 margin-bottom:0; 5595 list-style:none 5596} 5597.navbar-nav .nav-link{ 5598 padding-right:0; 5599 padding-left:0 5600} 5601.navbar-nav .dropdown-menu{ 5602 position:static; 5603 float:none 5604} 5605.navbar-text{ 5606 display:inline-block; 5607 padding-top:.5rem; 5608 padding-bottom:.5rem 5609} 5610.navbar-collapse{ 5611 -ms-flex-preferred-size:100%; 5612 flex-basis:100%; 5613 -webkit-box-flex:1; 5614 -ms-flex-positive:1; 5615 flex-grow:1; 5616 -webkit-box-align:center; 5617 -ms-flex-align:center; 5618 align-items:center 5619} 5620.navbar-toggler{ 5621 padding:.25rem .75rem; 5622 font-size:1.25rem; 5623 line-height:1; 5624 background-color:transparent; 5625 border:1px solid transparent; 5626 border-radius:.25rem 5627} 5628.navbar-toggler:focus,.navbar-toggler:hover{ 5629 text-decoration:none 5630} 5631.navbar-toggler:not(:disabled):not(.disabled){ 5632 cursor:pointer 5633} 5634.navbar-toggler-icon{ 5635 display:inline-block; 5636 width:1.5em; 5637 height:1.5em; 5638 vertical-align:middle; 5639 content:""; 5640 background:no-repeat center center; 5641 background-size:100% 100% 5642} 5643@media (max-width:575.98px){ 5644 .navbar-expand-sm>.container,.navbar-expand-sm>.container-fluid{ 5645 padding-right:0; 5646 padding-left:0 5647 } 5648 5649} 5650@media (min-width:576px){ 5651 .navbar-expand-sm{ 5652 -webkit-box-orient:horizontal; 5653 -webkit-box-direction:normal; 5654 -ms-flex-flow:row nowrap; 5655 flex-flow:row nowrap; 5656 -webkit-box-pack:start; 5657 -ms-flex-pack:start; 5658 justify-content:flex-start 5659 } 5660 .navbar-expand-sm .navbar-nav{ 5661 -webkit-box-orient:horizontal; 5662 -webkit-box-direction:normal; 5663 -ms-flex-direction:row; 5664 flex-direction:row 5665 } 5666 .navbar-expand-sm .navbar-nav .dropdown-menu{ 5667 position:absolute 5668 } 5669 .navbar-expand-sm .navbar-nav .dropdown-menu-right{ 5670 right:0; 5671 left:auto 5672 } 5673 .navbar-expand-sm .navbar-nav .nav-link{ 5674 padding-right:.5rem; 5675 padding-left:.5rem 5676 } 5677 .navbar-expand-sm>.container,.navbar-expand-sm>.container-fluid{ 5678 -ms-flex-wrap:nowrap; 5679 flex-wrap:nowrap 5680 } 5681 .navbar-expand-sm .navbar-collapse{ 5682 display:-webkit-box!important; 5683 display:-ms-flexbox!important; 5684 display:flex!important; 5685 -ms-flex-preferred-size:auto; 5686 flex-basis:auto 5687 } 5688 .navbar-expand-sm .navbar-toggler{ 5689 display:none 5690 } 5691 .navbar-expand-sm .dropup .dropdown-menu{ 5692 top:auto; 5693 bottom:100% 5694 } 5695 5696} 5697@media (max-width:767.98px){ 5698 .navbar-expand-md>.container,.navbar-expand-md>.container-fluid{ 5699 padding-right:0; 5700 padding-left:0 5701 } 5702 5703} 5704@media (min-width:768px){ 5705 .navbar-expand-md{ 5706 -webkit-box-orient:horizontal; 5707 -webkit-box-direction:normal; 5708 -ms-flex-flow:row nowrap; 5709 flex-flow:row nowrap; 5710 -webkit-box-pack:start; 5711 -ms-flex-pack:start; 5712 justify-content:flex-start 5713 } 5714 .navbar-expand-md .navbar-nav{ 5715 -webkit-box-orient:horizontal; 5716 -webkit-box-direction:normal; 5717 -ms-flex-direction:row; 5718 flex-direction:row 5719 } 5720 .navbar-expand-md .navbar-nav .dropdown-menu{ 5721 position:absolute 5722 } 5723 .navbar-expand-md .navbar-nav .dropdown-menu-right{ 5724 right:0; 5725 left:auto 5726 } 5727 .navbar-expand-md .navbar-nav .nav-link{ 5728 padding-right:.5rem; 5729 padding-left:.5rem 5730 } 5731 .navbar-expand-md>.container,.navbar-expand-md>.container-fluid{ 5732 -ms-flex-wrap:nowrap; 5733 flex-wrap:nowrap 5734 } 5735 .navbar-expand-md .navbar-collapse{ 5736 display:-webkit-box!important; 5737 display:-ms-flexbox!important; 5738 display:flex!important; 5739 -ms-flex-preferred-size:auto; 5740 flex-basis:auto 5741 } 5742 .navbar-expand-md .navbar-toggler{ 5743 display:none 5744 } 5745 .navbar-expand-md .dropup .dropdown-menu{ 5746 top:auto; 5747 bottom:100% 5748 } 5749 5750} 5751@media (max-width:991.98px){ 5752 .navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid{ 5753 padding-right:0; 5754 padding-left:0 5755 } 5756 5757} 5758@media (min-width:992px){ 5759 .navbar-expand-lg{ 5760 -webkit-box-orient:horizontal; 5761 -webkit-box-direction:normal; 5762 -ms-flex-flow:row nowrap; 5763 flex-flow:row nowrap; 5764 -webkit-box-pack:start; 5765 -ms-flex-pack:start; 5766 justify-content:flex-start 5767 } 5768 .navbar-expand-lg .navbar-nav{ 5769 -webkit-box-orient:horizontal; 5770 -webkit-box-direction:normal; 5771 -ms-flex-direction:row; 5772 flex-direction:row 5773 } 5774 .navbar-expand-lg .navbar-nav .dropdown-menu{ 5775 position:absolute 5776 } 5777 .navbar-expand-lg .navbar-nav .dropdown-menu-right{ 5778 right:0; 5779 left:auto 5780 } 5781 .navbar-expand-lg .navbar-nav .nav-link{ 5782 padding-right:.5rem; 5783 padding-left:.5rem 5784 } 5785 .navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid{ 5786 -ms-flex-wrap:nowrap; 5787 flex-wrap:nowrap 5788 } 5789 .navbar-expand-lg .navbar-collapse{ 5790 display:-webkit-box!important; 5791 display:-ms-flexbox!important; 5792 display:flex!important; 5793 -ms-flex-preferred-size:auto; 5794 flex-basis:auto 5795 } 5796 .navbar-expand-lg .navbar-toggler{ 5797 display:none 5798 } 5799 .navbar-expand-lg .dropup .dropdown-menu{ 5800 top:auto; 5801 bottom:100% 5802 } 5803 5804} 5805@media (max-width:1199.98px){ 5806 .navbar-expand-xl>.container,.navbar-expand-xl>.container-fluid{ 5807 padding-right:0; 5808 padding-left:0 5809 } 5810 5811} 5812@media (min-width:1200px){ 5813 .navbar-expand-xl{ 5814 -webkit-box-orient:horizontal; 5815 -webkit-box-direction:normal; 5816 -ms-flex-flow:row nowrap; 5817 flex-flow:row nowrap; 5818 -webkit-box-pack:start; 5819 -ms-flex-pack:start; 5820 justify-content:flex-start 5821 } 5822 .navbar-expand-xl .navbar-nav{ 5823 -webkit-box-orient:horizontal; 5824 -webkit-box-direction:normal; 5825 -ms-flex-direction:row; 5826 flex-direction:row 5827 } 5828 .navbar-expand-xl .navbar-nav .dropdown-menu{ 5829 position:absolute 5830 } 5831 .navbar-expand-xl .navbar-nav .dropdown-menu-right{ 5832 right:0; 5833 left:auto 5834 } 5835 .navbar-expand-xl .navbar-nav .nav-link{ 5836 padding-right:.5rem; 5837 padding-left:.5rem 5838 } 5839 .navbar-expand-xl>.container,.navbar-expand-xl>.container-fluid{ 5840 -ms-flex-wrap:nowrap; 5841 flex-wrap:nowrap 5842 } 5843 .navbar-expand-xl .navbar-collapse{ 5844 display:-webkit-box!important; 5845 display:-ms-flexbox!important; 5846 display:flex!important; 5847 -ms-flex-preferred-size:auto; 5848 flex-basis:auto 5849 } 5850 .navbar-expand-xl .navbar-toggler{ 5851 display:none 5852 } 5853 .navbar-expand-xl .dropup .dropdown-menu{ 5854 top:auto; 5855 bottom:100% 5856 } 5857 5858} 5859.navbar-expand{ 5860 -webkit-box-orient:horizontal; 5861 -webkit-box-direction:normal; 5862 -ms-flex-flow:row nowrap; 5863 flex-flow:row nowrap; 5864 -webkit-box-pack:start; 5865 -ms-flex-pack:start; 5866 justify-content:flex-start 5867} 5868.navbar-expand>.container,.navbar-expand>.container-fluid{ 5869 padding-right:0; 5870 padding-left:0 5871} 5872.navbar-expand .navbar-nav{ 5873 -webkit-box-orient:horizontal; 5874 -webkit-box-direction:normal; 5875 -ms-flex-direction:row; 5876 flex-direction:row 5877} 5878.navbar-expand .navbar-nav .dropdown-menu{ 5879 position:absolute 5880} 5881.navbar-expand .navbar-nav .dropdown-menu-right{ 5882 right:0; 5883 left:auto 5884} 5885.navbar-expand .navbar-nav .nav-link{ 5886 padding-right:.5rem; 5887 padding-left:.5rem 5888} 5889.navbar-expand>.container,.navbar-expand>.container-fluid{ 5890 -ms-flex-wrap:nowrap; 5891 flex-wrap:nowrap 5892} 5893.navbar-expand .navbar-collapse{ 5894 display:-webkit-box!important; 5895 display:-ms-flexbox!important; 5896 display:flex!important; 5897 -ms-flex-preferred-size:auto; 5898 flex-basis:auto 5899} 5900.navbar-expand .navbar-toggler{ 5901 display:none 5902} 5903.navbar-expand .dropup .dropdown-menu{ 5904 top:auto; 5905 bottom:100% 5906} 5907.navbar-light .navbar-brand{ 5908 color:rgba(0,0,0,.9) 5909} 5910.navbar-light .navbar-brand:focus,.navbar-light .navbar-brand:hover{ 5911 color:rgba(0,0,0,.9) 5912} 5913.navbar-light .navbar-nav .nav-link{ 5914 color:rgba(0,0,0,.5) 5915} 5916.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover{ 5917 color:rgba(0,0,0,.7) 5918} 5919.navbar-light .navbar-nav .nav-link.disabled{ 5920 color:rgba(0,0,0,.3) 5921} 5922.navbar-light .navbar-nav .active>.nav-link,.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .show>.nav-link{ 5923 color:rgba(0,0,0,.9) 5924} 5925.navbar-light .navbar-toggler{ 5926 color:rgba(0,0,0,.5); 5927 border-color:rgba(0,0,0,.1) 5928} 5929.navbar-light .navbar-toggler-icon{ 5930 background-image:url("data:image/svg+xml; 5931 charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") 5932} 5933.navbar-light .navbar-text{ 5934 color:rgba(0,0,0,.5) 5935} 5936.navbar-light .navbar-text a{ 5937 color:rgba(0,0,0,.9) 5938} 5939.navbar-light .navbar-text a:focus,.navbar-light .navbar-text a:hover{ 5940 color:rgba(0,0,0,.9) 5941} 5942.navbar-dark .navbar-brand{ 5943 color:#fff 5944} 5945.navbar-dark .navbar-brand:focus,.navbar-dark .navbar-brand:hover{ 5946 color:#fff 5947} 5948.navbar-dark .navbar-nav .nav-link{ 5949 color:rgba(255,255,255,.5) 5950} 5951.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{ 5952 color:rgba(255,255,255,.75) 5953} 5954.navbar-dark .navbar-nav .nav-link.disabled{ 5955 color:rgba(255,255,255,.25) 5956} 5957.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link.active,.navbar-dark .navbar-nav .nav-link.show,.navbar-dark .navbar-nav .show>.nav-link{ 5958 color:#fff 5959} 5960.navbar-dark .navbar-toggler{ 5961 color:rgba(255,255,255,.5); 5962 border-color:rgba(255,255,255,.1) 5963} 5964.navbar-dark .navbar-toggler-icon{ 5965 background-image:url("data:image/svg+xml; 5966 charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") 5967} 5968.navbar-dark .navbar-text{ 5969 color:rgba(255,255,255,.5) 5970} 5971.navbar-dark .navbar-text a{ 5972 color:#fff 5973} 5974.navbar-dark .navbar-text a:focus,.navbar-dark .navbar-text a:hover{ 5975 color:#fff 5976} 5977.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{ 5978 font-family:inherit; 5979 font-weight:500; 5980 line-height:1.2; 5981 color:inherit 5982} 5983.h1,h1{ 5984 font-size:2.5rem 5985} 5986.h2,h2{ 5987 font-size:2rem 5988} 5989.h3,h3{ 5990 font-size:1.75rem 5991} 5992.h4,h4{ 5993 font-size:1.5rem 5994} 5995.h5,h5{ 5996 font-size:1.25rem 5997} 5998.h6,h6{ 5999 font-size:1rem 6000} 6001.tab-content>.tab-pane{ 6002 display:none 6003} 6004.tab-content>.active{ 6005 display:block 6006} 6007.form-group { 6008 margin-bottom: 1rem; 6009 6010}
6011.btn { 6012 display: inline-block; 6013 font-weight: 400; 6014 text-align: center; 6015 white-space: nowrap; 6016 vertical-align: middle; 6017 -webkit-user-select: none; 6018 -moz-user-select: none; 6019 -ms-user-select: none; 6020 user-select: none; 6021 border: 1px solid transparent; 6022 padding: 0.375rem 0.75rem; 6023 font-size: 1rem; 6024 line-height: 1.5; 6025 border-radius: 0.25rem; 6026} 6027</style> 6028<style> 6029 .submitButton{ 6030 background: #fff !important; 6031 color: #000 !important; 6032 border-radius: 1px !important; 6033 padding: 15px 4px !important; 6034 } 6035 a{color:#fff} 6036</style> 6037 6038<div class="register-container"> 6039 <!-- <img loading="lazy" class="img-cover" src="/core/composer/view.php?id_img=484491&webp=1"> --> 6040 <div class="container-login text-center"> 6041 <div id="loaderForm"> 6042 <div class="tologin"> 6043 Log in | Donât have an account yet? <a style="color:#fff; text-decoration:underline" title="Register" href="/register">Register</a> 6044 </div> 6045 <div class="row"> 6046 <div class="col-md-8 offset-md-2 col-lg-6 offset-lg-3 text-center"> 6047 <form id="login" method="post" action="/core/?users:login"> 6048 <input type="hidden" name="crew" value=""> 6049 <input type="hidden" name="yref" value=""> 6050 <div class="formContainer"> 6051 <div class="input-border"> 6052 <input name="email" type="text" class="form-control inputMandatory" placeholder="Email"/> 6053 </div> 6054 <div class="input-border"> 6055 <input name="password" type="password" class="form-control inputMandatory" placeholder="Password"/> 6056 </div> 6057 <a style="text-decoration:underline" title="Forgot Password?" id="forgotPass" href="/forgot-password"> 6058 <span style="color:#fff" class="gold">Forgot Password?</span> 6059 </a> 6060 <div class="sub-container"> 6061 <button class="submitButton"> 6062 LETâS GO! 6063 </button> 6064 </div> 6065 </div> 6066 </form> 6067 6068 <div class="termpolicy"> 6069 Sign up indicates that youâve read and <br /> agree to our General <a style="color:#fff; text-decoration:underline" title="Terms and Conditions" href="/core/img/docs/General%20Terms%20and%20Conditions.pdf" target="_blank">Terms and Conditions</a>. 6070 </div> 6071 </div> 6072 </div> 6073 </div> 6074 </div> 6075</div> 6076 6077 6078<link rel="stylesheet" type="text/css" href="/core/css/css-cdn/sweetalert2.css"> 6079 </div> 6080 </main>
vendor: 123 bytes, lines 6080-6082
6080 6081 6082 <script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" async defer src="https://www.google.com/recaptcha/api.js?render=
60826LdU6tgUAAAAAK-2XNIWur2bljTBwDXMLapHxNCU
vendor: 38 bytes, lines 6082-6083
6082&onload=onloadCallback"></script> 6083
6083<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq"> 6084 $(function(){ 6085 $('#submitNewsletter').unbind().on("click", function(){ 6086 grecaptcha.ready(function () { 6087 grecaptcha.execute('6LdU6tgUAAAAAK-2XNIWur2bljTBwDXMLapHxNCU', { 6088 action: 'homepage' 6089 }).then(function (token) { 6090 6091 $('#recaptcha_n').val(token); 6092 6093 // Invia la form 6094 $('#newsletterSubscription').submit(); 6095 }); 6096 }); 6097 //$('#newsletterSubscription').submit(); 6098 }) 6099 6100 }) 6101 </script>
6101 6102 <div 6103 x-data="{ 6104 footerVisible: false, 6105 handleFooterIntersect(entries) { 6106 entries.forEach(entry => { 6107 const isVisible = entry.intersectionRatio > 0.1; 6108 if (this.footerVisible !== isVisible) { 6109 this.footerVisible = isVisible; 6110 this.$dispatch(isVisible ? 'hide-bar' : 'show-bar'); 6111 } 6112 }); 6113 } 6114 }" 6115 x-init=" 6116 const observer = new IntersectionObserver( 6117 (entries) => handleFooterIntersect(entries), 6118 { threshold: [0, 0.1, 0.5, 0.9, 1], rootMargin: '0px' } 6119 ); 6120 observer.observe($el); 6121 " 6122 id="footer" 6123 class="relative bg-black text-white overflow-hidden pt-[76px] s:pt-[35vh] r:pt-[80vh] pb-[20px] r:pb-0 before:absolute before:z-10 before:content-[''] before:inset-0 before:[background:linear-gradient(180deg,rgba(0,0,0,0.16)0%,rgba(0,0,0,0.8)50%)]"> 6124 <img style="position: absolute; top: 40vh; left: 50%; transform: translate(-50%, -50%); width:100px; z-index: 20" src="/core/view/website_2/src/images/emblem-white.png"> 6125 <div class="relative h-[400px] s:h-full s:absolute s:inset-0"> 6126 <video data-scroll data-scroll-speed="-0.2" class="absolute h-[600px] inset-0 w-full s:h-full object-cover object-top" autoplay muted loop playsinline> 6127 <source src="/core/view/website_2/src/video/footer-4.mp4" type="video/mp4"> 6128 </video> 6129 </div> 6130 <div class="container relative z-20"> 6131 <div class="site-grid"> 6132 <div class="col-span-2 s:col-span-5 r:col-span-3 r:order-last r:col-start-10"> 6133 <h2 class="body-14 all-caps r mb-[40px] s:mb-[48px]">Stay aboard for exclusive updates & the latest from the world of yachting</h2> 6134 <form id="newsletterSubscription" 6135 x-data="{ formStatus: 'iddle' }" 6136 6137 action="/core/?users:footer_newsletter_2"> 6138 <div class="relative w-full group overflow-hidden"> 6139 <input id="recaptcha_n" name="captcha" type="hidden"> 6140 <input name="4e878dc1b14976cd07a25d412550fee6" class="w-full pr-[80px] h-[48px] placeholder:text-white/70 placeholder:body-14 bg-transparent border-b border-white/40 relative z-10 focus:outline-none text-[16px]" type="email" placeholder="Enter your email address"> 6141 6142 <div class="absolute w-full h-[1px] bottom-0 left-0 bg-white -translate-x-full transition-all group-hover:translate-x-0 group-focus-within:translate-x-0"></div> 6143 <div id="submitNewsletter" type="" class="absolute right-0 top-1/2 -translate-y-1/2 body-12 all-caps z-10 cursor-pointer">Sign up</div> 6144 </div> 6145 <!-- Success State --> 6146 <div 6147 x-cloak 6148 x-show="formStatus === 'success'" 6149 x-transition 6150 class="flex items-center gap-x-[10px] px-[20px] py-[10px] bg-success-green text-black my-[30px]"> 6151 <div class="flex-none w-[24px] h-[24px] flex items-center justify-center rounded-full bg-black text-white"> 6152 <svg class="w-[12px] h-[12px]" aria-hidden="true" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> 6153 <path d="M1 6.32941L4.32941 9.65882L11 3" stroke="currentColor" stroke-linecap="square" stroke-linejoin="round" /> 6154 </svg> 6155 </div> 6156 <p class="body-14"> 6157 Thank you for subscribing! Youâre now on board to receive the latest news, exclusive updates, and yachting inspiration from C&N. </p> 6158 </div> 6159 <!-- Error State --> 6160 <div 6161 x-cloak 6162 x-show="formStatus === 'error'" 6163 x-transition 6164 class="flex items-center gap-x-[10px] px-[20px] py-[10px] bg-alert-orange text-black my-[30px]"> 6165 <svg class="w-[18px] h-[18px] flex-none" aria-hidden="true" width="16" height="16" viewB
6165ox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 6166 <path d="M8.00016 1.33301C4.32016 1.33301 1.3335 4.31967 1.3335 7.99967C1.3335 11.6797 4.32016 14.6663 8.00016 14.6663C11.6802 14.6663 14.6668 11.6797 14.6668 7.99967C14.6668 4.31967 11.6802 1.33301 8.00016 1.33301ZM8.66683 11.333H7.3335V7.33301H8.66683V11.333ZM8.66683 5.99967H7.3335V4.66634H8.66683V5.99967Z" fill="currentColor" /> 6167 </svg> 6168 <p class="body-14"> 6169 Something went wrong â please check the form for errors and try again. If the issue persists, contact our team at <span class="font-medium"><a href="mailto:[email protected]">[email protected]</a></span> </p> 6170 </div> 6171 <p class="text-white/50 body-12 mt-[30px]">By submitting my email address, I consent to receive C&N updates. I understand that I can unsubscribe at any time according to the C&N Privacy Policy.</p> 6172 <div class="flex items-center gap-[12px] mt-[40px] s:mt-[48px]"> 6173 <a target="_blank" href="https://www.instagram.com/camperandnicholsons" class="text-black w-[40px] h-[40px] glass-fx hover-hover:hover:bg-white hover-hover:text-black rounded-[2px] flex items-center justify-center transition-colors"> 6174 6175 <svg class="w-[14px] h-[14px]" aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 6176 <path fill-rule="evenodd" clip-rule="evenodd" d="M5.16562 1.65062C5.89875 1.61687 6.1325 1.60938 8 1.60938C9.8675 1.60938 10.1012 1.6175 10.8337 1.65062C11.5662 1.68375 12.0662 1.80062 12.5037 1.97C12.9619 2.14312 13.3775 2.41375 13.7212 2.76375C14.0712 3.10687 14.3412 3.52187 14.5137 3.98062C14.6837 4.41812 14.8 4.91812 14.8337 5.64937C14.8675 6.38375 14.875 6.6175 14.875 8.48437C14.875 10.3519 14.8669 10.5856 14.8337 11.3187C14.8006 12.05 14.6837 12.55 14.5137 12.9875C14.3412 13.4463 14.0708 13.862 13.7212 14.2056C13.3775 14.5556 12.9619 14.8256 12.5037 14.9981C12.0662 15.1681 11.5662 15.2844 10.835 15.3181C10.1012 15.3519 9.8675 15.3594 8 15.3594C6.1325 15.3594 5.89875 15.3512 5.16562 15.3181C4.43437 15.285 3.93437 15.1681 3.49687 14.9981C3.03807 14.8256 2.62239 14.5552 2.27875 14.2056C1.92899 13.8623 1.65832 13.4468 1.48562 12.9881C1.31625 12.5506 1.2 12.0506 1.16625 11.3194C1.1325 10.585 1.125 10.3512 1.125 8.48437C1.125 6.61687 1.13312 6.38312 1.16625 5.65062C1.19937 4.91812 1.31625 4.41812 1.48562 3.98062C1.65858 3.52193 1.92945 3.10645 2.27937 2.76312C2.62252 2.41344 3.03779 2.14278 3.49625 1.97C3.93375 1.80062 4.43375 1.68437 5.165 1.65062H5.16562ZM10.7781 2.88812C10.0531 2.855 9.83562 2.84812 8 2.84812C6.16437 2.84812 5.94687 2.855 5.22187 2.88812C4.55125 2.91875 4.1875 3.03062 3.945 3.125C3.62437 3.25 3.395 3.39812 3.15437 3.63875C2.92628 3.86066 2.75074 4.1308 2.64062 4.42937C2.54625 4.67187 2.43437 5.03562 2.40375 5.70625C2.37062 6.43125 2.36375 6.64875 2.36375 8.48437C2.36375 10.32 2.37062 10.5375 2.40375 11.2625C2.43437 11.9331 2.54625 12.2969 2.64062 12.5394C2.75062 12.8375 2.92625 13.1081 3.15437 13.33C3.37625 13.5581 3.64687 13.7337 3.945 13.8437C4.1875 13.9381 4.55125 14.05 5.22187 14.0806C5.94687 14.1137 6.16375 14.1206 8 14.1206C9.83625 14.1206 10.0531 14.1137 10.7781 14.0806C11.4487 14.05 11.8125 13.9381 12.055 13.8437C12.3756 13.7187 12.605 13.5706 12.8456 13.33C13.0737 13.1081 13.2494 12.8375 13.3594 12.5394C13.4537 12.2969 13.5656 11.9331 13.5962 11.2625C13.6294 10.5375 13.6362 10.32 13.6362 8.48437C13.6362 6.64875 13.6294 6.43125 13.5962 5.70625C13.5656 5.03562 13.4537 4.67187 13.3594 4.42937C13.2344 4.10875 13.0862 3.87937 12.8456 3.63875C12.6237 3.41067 12.3536 3.23513 12.055 3.125C11.8125 3.03062 11.4487 2.91875 10.7781 2.88812ZM7.12187 10.6037C7.61229 10.8079 8.15836 10.8354 8.66683 10.6817C9.1753 10.528 9.61462 10.2024 9.90975 9.76078C10.2049 9.31911 10.3375 8.78867 10.285 8.26006C10.2325 7.73146 9.99813 7.23748 9.62187 6.8625C9.38202 6.6228 9.09201 6.43926 8.77271 6.32509C8.45341 6.21093 8.11277 6.16897 7.77531 6.20226C7.43785 6.23554 7.11197 6.34324 6.82113 6.51758C6.53028 6.69193 6.28171 6.92859 6.09331 7.21053C5.90491 7.49247 5.78137 7.81268 5.73157 8.1481C5.68178 8.48352 5.70697 8.82581 5.80534 9.15032C5.9037 9.47484 6.0728 9.77351 6.30045 10.0248C6.5281 10.2761 6.80864 10.4739 7.12187 10.6037ZM5.50125 5.98562C5.82939 5.65748 6.21895 5.39719 6.64769 5.2196C7.07642 5.04201 7.53594 4.95061 8 4.95061C8.46406 4.95061 8.92358 5.04201 9.35231 5.2196C9.78105 5.39719 10.1706 5.65748 10.4987 5.98562C10.8269 6.31377 11.0872 6.70332 11.2648 7.13206C11.4424 7.5608 11.5338 8.02031 11.5338 8.48437C11.5338 8.94844 11.4424 9.40795 11.2648 9.83669C11.0872 10.2654 10.8269 10.655 10.4987 10.9831C9.83604 11.6458 8.93721 12.0181 8 12.0181C7.06279 12.0181 6.16396 11.6458 5.50125 10.9831C4.83854 10.3204 4.46623 9.42159 4.46623 8.48437C4.46623 7.54716 4.83854 6.64833 5.50125 5.98562ZM12.3175 5.47687C12.3988 5.40017 12.4639 5.30793 12.5089 5.20561C12.554 5.10329 12.578 4.99298 12.5796 4.88121C12.5813 4.76943 12.5604 4.65847 12.5184 4.55488C12.4764 4.4513 12.414 4.35
6176719 12.335 4.27815C12.2559 4.1991 12.1618 4.13672 12.0582 4.0947C11.9547 4.05267 11.8437 4.03186 11.7319 4.03349C11.6201 4.03512 11.5098 4.05916 11.4075 4.10419C11.3052 4.14921 11.213 4.21431 11.1362 4.29562C10.9871 4.45377 10.9054 4.66383 10.9086 4.88121C10.9117 5.09859 10.9995 5.30617 11.1532 5.4599C11.3069 5.61363 11.5145 5.70139 11.7319 5.70456C11.9493 5.70773 12.1594 5.62606 12.3175 5.47687Z" fill="currentColor" /> 6177 </svg> 6178 </a> 6179 <a target="_blank" href="https://x.com/campernicholson" class="text-black w-[40px] h-[40px] glass-fx hover-hover:hover:bg-white hover-hover:text-black rounded-[2px] flex items-center justify-center transition-colors"> 6180 6181 <svg class="w-[14px] h-[13px]" aria-hidden="true" width="14" height="13" viewBox="0 0 14 13" fill="none" xmlns="http://www.w3.org/2000/svg"> 6182 <path d="M10.9539 0.175781H13.0624L8.45607 5.44046L13.875 12.6045H9.63202L6.30877 8.25955L2.50622 12.6045H0.39652L5.3234 6.97334L0.125 0.175781H4.47569L7.47962 4.14724L10.9539 0.175781ZM10.2139 11.3425H11.3822L3.84087 1.37149H2.58716L10.2139 11.3425Z" fill="currentColor" /> 6183 </svg> 6184 </a> 6185 <a target="_blank" href="https://www.youtube.com/@CamperNicholsons" class="text-black w-[40px] h-[40px] glass-fx hover-hover:hover:bg-white hover-hover:text-black rounded-[2px] flex items-center justify-center transition-colors"> 6186 6187 <svg class="w-[16px] h-[11px]" aria-hidden="true" width="16" height="11" viewB
6187ox="0 0 16 11" fill="none" xmlns="http://www.w3.org/2000/svg"> 6188 <path d="M15.1879 2.05044C15.103 1.74746 14.9375 1.47316 14.7091 1.25669C14.4743 1.03357 14.1865 0.873965 13.8729 0.792943C12.6991 0.483568 7.99664 0.483568 7.99664 0.483568C6.03622 0.461263 4.07628 0.559365 2.12789 0.777318C1.81426 0.864326 1.52699 1.0275 1.29164 1.25232C1.06039 1.47482 0.892886 1.74919 0.805386 2.04982C0.595194 3.18216 0.493068 4.33191 0.500386 5.48357C0.492886 6.63419 0.594761 7.78357 0.805386 8.91732C0.891011 9.21669 1.05789 9.48982 1.28976 9.71044C1.52164 9.93107 1.81039 10.0904 2.12789 10.1748C3.31726 10.4836 7.99664 10.4836 7.99664 10.4836C9.95955 10.5059 11.922 10.4078 13.8729 10.1898C14.1865 10.1088 14.4743 9.94919 14.7091 9.72607C14.9404 9.50544 15.1048 9.23107 15.1873 8.93232C15.4029 7.80041 15.5078 6.65019 15.5004 5.49794C15.5166 4.34082 15.4119 3.18517 15.1879 2.04982V2.05044ZM6.50164 7.62357V3.34419L10.4141 5.48419L6.50164 7.62357Z" fill="currentColor" /> 6189 </svg> 6190 </a> 6191 <a target="_blank" href="https://www.linkedin.com/company/camperandnicholsons/" class="text-black w-[40px] h-[40px] glass-fx hover-hover:hover:bg-white hover-hover:text-black rounded-[2px] flex items-center justify-center transition-colors"> 6192 6193 <svg class="w-[14px] h-[14px]" aria-hidden="true" width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg"> 6194 <path fill-rule="evenodd" clip-rule="evenodd" d="M0.125 1.75813C0.125 1.45346 0.246029 1.16127 0.461461 0.945838C0.676894 0.730405 0.969083 0.609377 1.27375 0.609377H12.725C12.876 0.60913 13.0255 0.638666 13.1651 0.696293C13.3046 0.753921 13.4315 0.838508 13.5383 0.945212C13.6451 1.05192 13.7298 1.17864 13.7876 1.31813C13.8454 1.45762 13.8751 1.60714 13.875 1.75813V13.2094C13.8752 13.3604 13.8456 13.51 13.7879 13.6495C13.7302 13.7891 13.6455 13.9159 13.5388 14.0227C13.432 14.1295 13.3052 14.2142 13.1657 14.272C13.0262 14.3298 12.8766 14.3595 12.7256 14.3594H1.27375C1.12284 14.3594 0.973412 14.3296 0.833998 14.2719C0.694585 14.2141 0.56792 14.1294 0.46124 14.0227C0.354561 13.916 0.269958 13.7892 0.212264 13.6498C0.154571 13.5104 0.124918 13.3609 0.125 13.21V1.75813ZM5.5675 5.85188H7.42938V6.78688C7.69813 6.24938 8.38563 5.76563 9.41875 5.76563C11.3994 5.76563 11.8688 6.83625 11.8688 8.80063V12.4394H9.86438V9.24813C9.86438 8.12938 9.59563 7.49813 8.91313 7.49813C7.96625 7.49813 7.5725 8.17875 7.5725 9.24813V12.4394H5.5675V5.85188ZM2.13 12.3538H4.135V5.76563H2.13V12.3531V12.3538ZM4.42188 3.61688C4.42566 3.78855 4.39511 3.95924 4.33203 4.11895C4.26894 4.27865 4.1746 4.42415 4.05452 4.5469C3.93445 4.66964 3.79106 4.76717 3.63279 4.83376C3.47451 4.90034 3.30453 4.93464 3.13281 4.93464C2.9611 4.93464 2.79112 4.90034 2.63284 4.83376C2.47456 4.76717 2.33118 4.66964 2.21111 4.5469C2.09103 4.42415 1.99668 4.27865 1.9336 4.11895C1.87052 3.95924 1.83997 3.78855 1.84375 3.61688C1.85117 3.27991 1.99024 2.95925 2.23118 2.72356C2.47212 2.48786 2.79577 2.35589 3.13281 2.35589C3.46986 2.35589 3.79351 2.48786 4.03445 2.72356C4.27539 2.95925 4.41446 3.27991 4.42188 3.61688Z" fill="currentColor" /> 6195 </svg> 6196 6197 </a> 6198 <a target="_blank" href="https://www.facebook.com/camperandnicholsons" class="text-black w-[40px] h-[40px] glass-fx hover-hover:hover:bg-white hover-hover:text-black rounded-[2px] flex items-center justify-center transition-colors"> 6199 6200 <svg class="w-[10px] h-[16px]" aria-hidden="true" width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 6201 <path d="M8.49141 9.42141L8.90813 6.70687H6.30329V4.94531C6.30329 4.20281 6.66704 3.47859 7.83375 3.47859H9.01782V1.16766C9.01782 1.16766 7.94344 0.984375 6.91594 0.984375C4.77094 0.984375 3.36891 2.28469 3.36891 4.63828V6.70734H0.984375V9.42187H3.36891V15.9844H6.30329V9.42187L8.49141 9.42141Z" fill="currentColor" /> 6202 </svg> 6203 </a> 6204 </div> 6205 </form> 6206 <form id="pardotNewsletter" class="hidden novalidate" action="https://go.camperandnicholsons.
6206com/l/74772/2026-02-05/crhpqv"> 6207 <input name="email" id="newsletterEmail"> 6208 </form> 6209 </div> 6210 <div class="col-span-2 s:col-span-8 r:col-span-6 s:mt-[64px] r:mt-0"> 6211 <div class="s:grid s:grid-cols-3 r:grid-cols-6 s:gap-x-[20px] s:gap-y-[64px]" 6212 x-data="{ 6213 openIndex: null, 6214 animateOpen(el) { 6215 el.style.display = 'block'; 6216 if (window.gsap) { 6217 gsap.fromTo(el, { height: 0, opacity: 0 }, { 6218 height: el.scrollHeight + 'px', 6219 opacity: 1, 6220 duration: 0.45, 6221 ease: 'power2.out', 6222 onComplete: () => { el.style.height = 'auto'; } 6223 }); 6224 } else { 6225 el.style.height = 'auto'; 6226 el.style.opacity = 1; 6227 } 6228 }, 6229 animateClose(el) { 6230 if (window.gsap) { 6231 gsap.to(el, { 6232 height: 0, 6233 opacity: 0, 6234 duration: 0.45, 6235 ease: 'power2.inOut', 6236 onComplete: () => { el.style.display = 'none'; } 6237 }); 6238 } else { 6239 el.style.height = 0; 6240 el.style.opacity = 0; 6241 el.style.display = 'none'; 6242 } 6243 }, 6244 toggleFooterAccordion(idx, contentRef) { 6245 if (this.openIndex === idx) { 6246 this.animateClose(contentRef); 6247 this.openIndex = null; 6248 } else { 6249 if (this.openIndex !== null) { 6250 const currentRef = this.$refs['footerContent' + this.openIndex]; 6251 if (currentRef) this.animateClose(currentRef); 6252 } 6253 this.openIndex = idx; 6254 this.$nextTick(() => this.animateOpen(contentRef)); 6255 } 6256 } 6257 }"> 6258 <div class="r:col-span-2"> 6259 <!-- Mobile Accordion --> 6260 <div class="s:hidden faq-accordion"> 6261 <div class="block border-b border-white/20"> 6262 <h2> 6263 <button type="button" 6264 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6265 :aria-expanded="openIndex === 0 ? 'true' : 'false'" 6266 @click="toggleFooterAccordion(0, $refs['footerContent0'])"> 6267 <span class="body-12 all-caps text-white">Yacht services</span> 6268 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6269 :class="{'rotate-45': openIndex === 0}"> 6270 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6271 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6272 </div> 6273 </button> 6274 </h2> 6275 <div class="accordion-content overflow-hidden" 6276 x-ref="footerContent0" 6277 style="display: none; height: 0; opacity: 0;"> 6278 <ul class="pb-[20px]"> 6279 <li class="mb-[4px]"> 6280 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/charter-a-yacht">Charter a Yacht</a> 6281 </li> 6282 <li class="mb-[4px]"> 6283 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/buy-a-yacht">Buy a Yacht</a> 6284 </li> 6285 <li class="mb-[4px]"> 6286 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sell-a-yacht">Sell a Yacht</a> 6287 </li> 6288 <li class="mb-[4px]"> 6289 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/build-a-yacht">Build a Yacht</a> 6290 </li> 6291 <li class="mb-[4px]"> 6292 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/design-studio">Design Studio</a> 6293 </li> 6294 </ul> 6295 </div> 6296 </div> 6297 </div> 6298 <!-- Desktop Block --> 6299 <div class="hidden s:block"> 6300 <h3 class="body-12 text-white/60 mb-[20px]">Yacht services</h3> 6301 <ul> 6302 <li class="mb-[4px]"> 6303 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/charter-a-yacht">Charter a Yacht</a> 6304 </li> 6305 <li class="mb-[4px]"> 6306 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/buy-a-yacht">Buy a Yacht</a> 6307 </li> 6308 <li class="mb-[4px]"> 6309 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sell-a-yacht">Sell a Yacht</a> 6310 </li> 6311 <li class="mb-[4px]"> 6312 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/build-a-yacht">Build a Yacht</a> 6313 </li> 6314 <li class="mb-[4px]"> 6315 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/design-studio">Design Studio</a> 6316 </li> 6317 </ul> 6318 </div> 6319 </div> 6320 <div class="r:col-span-2"> 6321 <!-- Mobile Accordion --> 6322 <div class="s:hidden faq-accordion"> 6323 <div class="block border-b border-white/20"> 6324 <h2> 6325 <button type="button" 6326 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6327 :aria-expanded="openIndex === 1 ? 'true' : 'false'" 6328 @click="toggleFooterAccordion(1, $refs['footerContent1'])">
6329 <span class="body-12 all-caps text-white">Owner Services</span> 6330 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6331 :class="{'rotate-45': openIndex === 1}"> 6332 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6333 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6334 </div> 6335 </button> 6336 </h2> 6337 <div class="accordion-content overflow-hidden" 6338 x-ref="footerContent1" 6339 style="display: none; height: 0; opacity: 0;"> 6340 <ul class="pb-[20px]"> 6341 <li class="mb-[4px]"> 6342 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/yacht-management">Yacht Management</a> 6343 </li> 6344 <li class="mb-[4px]"> 6345 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/charter-management">Charter Management</a> 6346 </li> 6347 <li class="mb-[4px]"> 6348 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/insurance-solutions">Insurance solutions</a> 6349 </li> 6350 <li class="mb-[4px]"> 6351 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/corporate-services">Corporate Services</a> 6352 </li> 6353 <li class="mb-[4px]"> 6354 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/crew-services">Crew Services</a> 6355 </li> 6356 </ul> 6357 </div> 6358 </div> 6359 </div> 6360 <!-- Desktop Block --> 6361 <div class="hidden s:block"> 6362 <h3 class="body-12 text-white/60 mb-[20px]">Owner Services</h3> 6363 <ul> 6364 <li class="mb-[4px]"> 6365 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/yacht-management">Yacht Management</a> 6366 </li> 6367 <li class="mb-[4px]"> 6368 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/charter-management">Charter Management</a> 6369 </li> 6370 <li class="mb-[4px]"> 6371 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/insurance-solutions">Insurance solutions</a> 6372 </li> 6373 <li class="mb-[4px]"> 6374 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/corporate-services">Corporate Services</a> 6375 </li> 6376 <li class="mb-[4px]"> 6377 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/crew-services">Crew Services</a> 6378 </li> 6379 </ul> 6380 </div> 6381 </div> 6382 <div class="r:col-span-2"> 6383 <!-- Mobile Accordion --> 6384 <div class="s:hidden faq-accordion"> 6385 <div class="block border-b border-white/20"> 6386 <h2> 6387 <button type="button" 6388 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6389 :aria-expanded="openIndex === 2 ? 'true' : 'false'" 6390 @click="toggleFooterAccordion(2, $refs['footerContent2'])">
6391 <span class="body-12 all-caps text-white">Explore</span> 6392 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6393 :class="{'rotate-45': openIndex === 2}"> 6394 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6395 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6396 </div> 6397 </button> 6398 </h2> 6399 <div class="accordion-content overflow-hidden" 6400 x-ref="footerContent2" 6401 style="display: none; height: 0; opacity: 0;"> 6402 <ul class="pb-[20px]"> 6403 <li class="mb-[4px]"> 6404 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/charter-a-yacht/destinations">Destinations</a> 6405 </li> 6406 <li class="mb-[4px]"> 6407 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/campaigns">Campaigns</a> 6408 </li> 6409 <li class="mb-[4px]"> 6410 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/academy">The Academy</a> 6411 </li> 6412 <li class="mb-[4px]"> 6413 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/frequently-asked-questions">Frequent Questions</a> 6414 </li> 6415 </ul> 6416 </div> 6417 </div> 6418 </div> 6419 <!-- Desktop Block --> 6420 <div class="hidden s:block"> 6421 <h3 class="body-12 text-white/60 mb-[20px]">Explore</h3> 6422 <ul> 6423 <li class="mb-[4px]"> 6424 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/charter-a-yacht/destinations">Destinations</a> 6425 </li> 6426 <li class="mb-[4px]"> 6427 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/campaigns">Campaigns</a> 6428 </li> 6429 <li class="mb-[4px]"> 6430 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/academy">The Academy</a> 6431 </li> 6432 <li class="mb-[4px]"> 6433 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/frequently-asked-questions">Frequent Questions</a> 6434 </li> 6435 </ul> 6436 </div> 6437 </div> 6438 <div class="r:col-span-2"> 6439 <!-- Mobile Accordion --> 6440 <div class="s:hidden faq-accordion"> 6441 <div class="block border-b border-white/20"> 6442 <h2> 6443 <button type="button" 6444 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6445 :aria-expanded="openIndex === 3 ? 'true' : 'false'" 6446 @click="toggleFooterAccordion(3, $refs['footerContent3'])">
6447 <span class="body-12 all-caps text-white">About us</span> 6448 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6449 :class="{'rotate-45': openIndex === 3}"> 6450 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6451 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6452 </div> 6453 </button> 6454 </h2> 6455 <div class="accordion-content overflow-hidden" 6456 x-ref="footerContent3" 6457 style="display: none; height: 0; opacity: 0;"> 6458 <ul class="pb-[20px]"> 6459 <li class="mb-[4px]"> 6460 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/the-brand">The Brand</a> 6461 </li> 6462 <li class="mb-[4px]"> 6463 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/team">The Team</a> 6464 </li> 6465 <li class="mb-[4px]"> 6466 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/careers">Careers</a> 6467 </li> 6468 <li class="mb-[4px]"> 6469 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/office">Offices</a> 6470 </li> 6471 </ul> 6472 </div> 6473 </div> 6474 </div> 6475 <!-- Desktop Block --> 6476 <div class="hidden s:block"> 6477 <h3 class="body-12 text-white/60 mb-[20px]">About us</h3> 6478 <ul> 6479 <li class="mb-[4px]"> 6480 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/the-brand">The Brand</a> 6481 </li> 6482 <li class="mb-[4px]"> 6483 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/team">The Team</a> 6484 </li> 6485 <li class="mb-[4px]"> 6486 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/careers">Careers</a> 6487 </li> 6488 <li class="mb-[4px]"> 6489 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/office">Offices</a> 6490 </li> 6491 </ul> 6492 </div> 6493 </div> 6494 <div class="r:col-span-2"> 6495 <!-- Mobile Accordion --> 6496 <div class="s:hidden faq-accordion"> 6497 <div class="block border-b border-white/20"> 6498 <h2> 6499 <button type="button" 6500 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6501 :aria-expanded="openIndex === 4 ? 'true' : 'false'" 6502 @click="toggleFooterAccordion(4, $refs['footerContent4'])">
6503 <span class="body-12 all-caps text-white">Contact</span> 6504 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6505 :class="{'rotate-45': openIndex === 4}"> 6506 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6507 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6508 </div> 6509 </button> 6510 </h2> 6511 <div class="accordion-content overflow-hidden" 6512 x-ref="footerContent4" 6513 style="display: none; height: 0; opacity: 0;"> 6514 <ul class="pb-[20px]"> 6515 <li class="mb-[4px]"> 6516 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/contact-us">Contact us</a> 6517 </li> 6518 <li class="mb-[4px]"> 6519 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sell-a-yacht/list-a-yacht">List a Yacht for Sale</a> 6520 </li> 6521 <li class="mb-[4px]"> 6522 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/charter-management/list-a-yacht">List a Yacht for Charter</a> 6523 </li> 6524 </ul> 6525 </div> 6526 </div> 6527 </div> 6528 <!-- Desktop Block --> 6529 <div class="hidden s:block"> 6530 <h3 class="body-12 text-white/60 mb-[20px]">Contact</h3> 6531 <ul> 6532 <li class="mb-[4px]"> 6533 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/contact-us">Contact us</a> 6534 </li> 6535 <li class="mb-[4px]"> 6536 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sell-a-yacht/list-a-yacht">List a Yacht for Sale</a> 6537 </li> 6538 <li class="mb-[4px]"> 6539 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/owner-services/charter-management/list-a-yacht">List a Yacht for Charter</a> 6540 </li> 6541 </ul> 6542 </div> 6543 </div> 6544 <div class="r:col-span-2"> 6545 <!-- Mobile Accordion --> 6546 <div class="s:hidden faq-accordion"> 6547 <div class="block border-b border-white/20"> 6548 <h2> 6549 <button type="button" 6550 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6551 :aria-expanded="openIndex === 5 ? 'true' : 'false'" 6552 @click="toggleFooterAccordion(5, $refs['footerContent5'])">
6553 <span class="body-12 all-caps text-white">Legal</span> 6554 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6555 :class="{'rotate-45': openIndex === 5}"> 6556 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6557 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6558 </div> 6559 </button> 6560 </h2> 6561 <div class="accordion-content overflow-hidden" 6562 x-ref="footerContent5" 6563 style="display: none; height: 0; opacity: 0;"> 6564 <ul class="pb-[20px]"> 6565 <li class="mb-[4px]"> 6566 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/terms-of-use">Terms of use</a> 6567 </li> 6568 <li class="mb-[4px]"> 6569 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/privacy-policy">Privacy Policy</a> 6570 </li> 6571 <li class="mb-[4px]"> 6572 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/cookie-policy">Cookies Policy</a> 6573 </li> 6574 <li class="mb-[4px]"> 6575 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/core/img/docs/General%20Terms%20and%20Conditions.pdf">Terms & Conditions</a> 6576 </li> 6577 </ul> 6578 </div> 6579 </div> 6580 </div> 6581 <!-- Desktop Block --> 6582 <div class="hidden s:block"> 6583 <h3 class="body-12 text-white/60 mb-[20px]">Legal</h3> 6584 <ul> 6585 <li class="mb-[4px]"> 6586 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/terms-of-use">Terms of use</a> 6587 </li> 6588 <li class="mb-[4px]"> 6589 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/privacy-policy">Privacy Policy</a> 6590 </li> 6591 <li class="mb-[4px]"> 6592 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/cookie-policy">Cookies Policy</a> 6593 </li> 6594 <li class="mb-[4px]"> 6595 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/core/img/docs/General%20Terms%20and%20Conditions.pdf">Terms & Conditions</a> 6596 </li> 6597 </ul> 6598 </div> 6599 </div> 6600 <div class="r:col-span-2"> 6601 <!-- Mobile Accordion --> 6602 <div class="s:hidden faq-accordion"> 6603 <div class="block border-b border-white/20"> 6604 <h2> 6605 <button type="button" 6606 class="faq-trigger group flex w-full items-center justify-between text-left py-[20px]" 6607 :aria-expanded="openIndex === 6 ? 'true' : 'false'" 6608 @click="toggleFooterAccordion(6, $refs['footerContent6'])">
6609 <span class="body-12 all-caps text-white"></span> 6610 <div class="w-[18px] h-[18px] relative transition-all ease-in-out group-hover:rotate-45" 6611 :class="{'rotate-45': openIndex === 6}"> 6612 <div class="accordion-minus absolute top-1/2 -translate-y-1/2 left-1/2 -translate-x-1/2 w-[1px] h-[11px] bg-white transition-transform duration-300"></div> 6613 <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[11px] h-[1px] bg-white"></div> 6614 </div> 6615 </button> 6616 </h2> 6617 <div class="accordion-content overflow-hidden" 6618 x-ref="footerContent6" 6619 style="display: none; height: 0; opacity: 0;"> 6620 <ul class="pb-[20px]"> 6621 <li class="mb-[4px]"> 6622 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sitemap">Sitemap</a> 6623 </li> 6624 </ul> 6625 </div> 6626 </div> 6627 </div> 6628 <!-- Desktop Block --> 6629 <div class="hidden s:block"> 6630 <h3 class="body-12 text-white/60 mb-[20px]"></h3> 6631 <ul> 6632 <li class="mb-[4px]"> 6633 <a class="relative inline-flex body-12 all-caps h-[32px] flex items-center before:content-[''] before:absolute before:bottom-0 before:left-0 before:h-[1px] before:bg-white before:w-0 hover-hover:hover:before:w-full before:transition-all before:ease-in-out" href="/sitemap">Sitemap</a> 6634 </li> 6635 </ul> 6636 </div> 6637 </div> 6638 </div> 6639 </div> 6640 </div> 6641 6642 <div class="flex flex-col r:flex-row mt-[40px] s:mt-[64px] r:mt-[120px] r:justify-between"> 6643 <!-- <p class="body-12 text-white/60 mb-[10px] r:hidden">Preferences</p> 6644 <div class="flex items-center justify-between text-left s:justify-evenly border-b border-white/20 r:border-none"> 6645 <button class="h-[48px] flex items-center gap-[10px] w-full s:justify-between"> 6646 <span class="body-12 all-caps">English</span> 6647 <svg width="9" height="6" viewBox="0 0 9 6" fill="none" xmlns="http://www.w3.org/2000/svg"> 6648 <path d="M8.2625 0.683594L4.66171 4.78704L1.0625 0.683594" stroke="white" stroke-miterlimit="10" /> 6649 </svg> 6650 </button> 6651 <span class="mx-[20px] h-[16px] w-[1px] bg-white/20 inline-block"></span> 6652 <button class="h-[48px] flex items-center gap-[10px] w-full s:justify-between"> 6653 <span class="body-12 all-caps">eur (â¬)</span> 6654 <svg width="9" height="6" viewBox="0 0 9 6" fill="none" xmlns="http://www.w3.org/2000/svg"> 6655 <path d="M8.2625 0.683594L4.66171 4.78704L1.0625 0.683594" stroke="white" stroke-miterlimit="10" /> 6656 </svg> 6657 </button>
6658 <span class="mx-[20px] h-[16px] w-[1px] bg-white/20 inline-block"></span> 6659 <button class="h-[48px] flex items-center gap-[10px] w-full s:justify-between"> 6660 <span class="body-12 all-caps">Meters</span> 6661 <svg width="9" height="6" viewBox="0 0 9 6" fill="none" xmlns="http://www.w3.org/2000/svg"> 6662 <path d="M8.2625 0.683594L4.66171 4.78704L1.0625 0.683594" stroke="white" stroke-miterlimit="10" /> 6663 </svg> 6664 </button> 6665 </div> --> 6666 <div class="flex body-12 justify-between r:justify-start mt-[40px] r:mt-0 r:order-first items-center mb-[10px]"> 6667 <p>©2026 | Camper & Nicholsons</p> 6668 </div> 6669 </div> 6670 </div> 6671 </div> 6672 6673
6673<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/view/website_2/src/scripts/vendor_2/gsap.min.js"></script>
vendor: 1 bytes, line 6673
6673
6674<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/view/website_2/src/scripts/vendor_2/ScrollTrigger.min.js"></script>
vendor: 1 bytes, line 6674
6674
6675<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/SplitText.min.js"></script>
vendor: 1 bytes, line 6675
6675
6676<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/view/website_2/src/scripts/vendor_2/splide.min.js"></script>
vendor: 1 bytes, line 6676
6676
6677<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/view/website_2/src/scripts/vendor_2/splide-extension-auto-scroll.min.js"></script>
6677 6678<!--
6678<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="https://cdn.jsdelivr.net/npm/locomotive-scroll@beta/bundled/locomotive-scroll.min.js"></script>
6678 -->
6679<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/view/website_2/src/scripts/vendor_2/locomotive-scroll.min.js"></script>
6679 6680
6680<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" type="module" src="/core/view/website_2/src/scripts/main.js?v=425"></script>
6680 6681
6681<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" async type="text/javascript" src="/core/js/form.js?v=12"></script>
6681 6682
6682<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" defer src="https://cdn.jsdelivr.net/npm/@alpinejs/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6682
6682
6683<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" defer src="https://cdn.jsdelivr.net/npm/@alpinejs/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6683
6683
6684<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" defer src="https://cdn.jsdelivr.net/npm/@alpinejs/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6684
6684
6685<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" defer src="https://cdn.jsdelivr.net/npm/@alpinejs/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6685
6685
6686<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="https://unpkg.com/[email protected]/dist/js/alpine-splide.script.js"></script>
vendor: 1 bytes, line 6686
6686
6687<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="https://cdn.jsdelivr.net/npm/@ryangjchandler/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6687
6687
6688<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/cdn.min.js"></script>
vendor: 1 bytes, line 6688
6688
6689<script nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" src="/core/js/sweetalert2.min.js"></script>
6689 6690<link rel="stylesheet" type="text/css" href="/core/css/css-cdn/sweetalert2.css">
6690<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" nonce="KA9INPvLWcUu37mTfibSVlY6EZ8DezGq" data-cf-beacon='{"version":"2024.11.0","token":"b278f73e3d0242e0a4a4c1f4ce35d15c","spa":2}' crossorigin="anonymous"></script>
6690 6691</body> 6692 6693</html> 6694 6695 6696 6697 6698 6699
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.