/* xokk.co.uk: static rebuild */
*,*::before,*::after{box-sizing:border-box}
html{font-size:14px;-webkit-text-size-adjust:100%;overflow-x:hidden;background:#fff}
body{margin:0;padding-top:90px;overflow-x:hidden;line-height:1.7;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#000}
@media (min-width:1025px){body{padding-top:40px}}
img{max-width:100%;height:auto;vertical-align:middle;border:0}
a{color:#ff2a13;text-decoration:none}
a:hover{color:#d80f0f}
p{margin:0 0 1.313em}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:100000;background:#fff;padding:6px 10px}

.container{width:89%;max-width:1400px;margin:0 auto;position:relative}
.container::after{content:"";display:table;clear:both}

/* header */
.navbar-wrap{height:70px;margin-bottom:1px}
@media (max-width:978.98px){.navbar-wrap{height:auto;margin-bottom:0}}
.navbar{position:fixed;top:0;left:0;right:0;z-index:99999;min-height:70px;background:#fff;border-bottom:1px solid #ccc;box-shadow:0 .15em .35em #0002;transform:translate(0)}
@media (max-width:420px){.navbar{padding-top:10px;padding-bottom:8px}}
.brand{display:block;float:left;margin-top:13px;line-height:1}
.brand img{width:130px}
.navbar .nav{display:block;float:right;margin:0;padding:0;list-style:none}
.navbar .nav li{float:left}
.navbar .nav a{display:block;height:70px;padding:37px 20px 0;float:none;line-height:1;font-size:13px;font-weight:700;letter-spacing:.085em;text-transform:uppercase;color:#999}
.navbar .nav a:hover,.navbar .nav .current a{color:#272727;box-shadow:inset 0 4px 0 0 #ff2a13}
@media (max-width:600px){
  body{padding-top:125px}
  .navbar{min-height:142px}
  .navbar .nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;width:100%;margin-top:19px}
  .navbar .nav a{height:auto;padding:10px;font-size:15px;line-height:1.2}
}
@media (max-width:420px){.navbar .nav a{font-size:12.5px;padding:8px}}

/* sections */
.section{display:block;position:relative;margin:0;padding:45px 0;z-index:1}
.section.paper::before{content:"";position:absolute;inset:0;z-index:-1;background:url(/img/stealing-chocolate-paper-background-2.webp) center/cover no-repeat}
.bgwhite{position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.5)}
.row{display:flex;justify-content:center;align-items:stretch;width:89%;max-width:1400px;margin:0 auto;padding:0}
.row>.col{flex:0 0 100%;max-width:100%;min-width:0;margin:0;position:relative}
.center{text-align:center}
.text{min-width:1px;font-family:Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif}
.text>:first-child{margin-top:0}
.text>:last-child{margin-bottom:0}
.line{display:block;width:0;height:0;margin:0;border:0;padding:0}
.sep{display:block;position:absolute;left:0;right:0;margin:0 auto;height:10px;color:#6b0f0f;z-index:10;pointer-events:none}
.sep svg{display:block;width:100%;height:100%;fill:currentColor}
.sep-top{top:0;transform:translateY(-100%)}
.sep-bottom{bottom:0;transform:translateY(100%)}

/* home */
.s-home-1{padding:20px 0}
.hero-cover{display:block;width:auto;max-width:100%;height:auto;margin:0 5%}
.hero-cover img{display:block;width:100%;height:auto}
.hero-line{font-size:18px;color:#333;text-align:center}
.s-home-1 .row:first-of-type{text-align:center}
.s-home-2{padding:2vw 0}
.home-body{font-size:2.4em;color:#000;text-align:center}
.s-home-3{padding:1vw 0}
.s-home-3 .row{font-size:.85em}
.s-home-3 .col{padding-top:18px}
.btn{display:inline-flex;overflow:hidden;position:relative;min-width:1px;border-radius:.35em;background:#fff;box-shadow:0 .15em .65em 0 rgba(0,0,0,.25);font-family:Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif;text-decoration:none}
.btn span{display:block;margin:5px;padding:.575em .85em;font-size:1.2em;line-height:1;color:#000;transition:color .3s}
.btn:hover span{color:rgba(0,0,0,.5)}

/* extract */
.s-extract{padding:65px 0}
.s-extract .row{font-size:1.45em}
.extract-head{font-size:1.4em;line-height:1.65;color:#000}
.extract-head h5{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:150%;font-weight:700;letter-spacing:-.035em;line-height:1.4;margin:0 0 .5em;color:#000}
.extract-head p{margin:0}
.extract-body{font-size:1.3em;line-height:1.65;text-align:left;color:#000}
.extract-body p{margin:0 0 .45em}
.line.l1{padding-top:2em;font-size:.95em}
.line.l2{padding-top:2em;font-size:.85em}
.line.l3{width:22%;max-width:none;border-top:.9em double rgba(0,0,0,.5);font-size:.5em}

/* about */
.s-about{padding:65px 0}
.about-body{font-size:28px;color:#000}
.about-body img{margin:5px 20px 32px 0}

/* footer */
.colophon{background:#fff;padding:10px 0 30px;font-size:10px;text-align:center;color:#7a7a7a;position:relative}
.colophon .nav{margin:10px 0;padding:0;list-style:none;line-height:1.3}
.colophon .nav li{display:inline-block;margin:0 .5em}
.colophon .nav a{display:block;font-weight:400;letter-spacing:2px;text-transform:uppercase;color:#ff2a13}

/* small screens (the live site tuned these by hand) */
@media (min-width:700px) and (max-width:1024px){
  .home-body{font-size:17.5px;line-height:1.5}
  .extract-head,.extract-body{font-size:17px;line-height:1.5}
  body.page-about .about-body,body.page-about .about-body *{font-size:16.5px;line-height:1.45}
}
@media (max-width:600px){
  .home-body,.hero-line,.extract-body{font-size:16px;line-height:1.45}
  body.home .row{width:100%;max-width:none;padding-left:16px;padding-right:16px}
  .s-extract,.s-about{padding-top:30px}
  .about-body{font-size:17px;line-height:1.42}
  .s-extract .row{font-size:17px}
  .extract-head,.extract-body{font-size:17px;line-height:1.5}
  .hero-cover{margin:0 7px}
  .hero-cover img{height:170px;object-fit:cover;object-position:bottom}
}
@media (max-width:420px){
  p,li{line-height:1.42}
  .home-body,.hero-line,.extract-head,.extract-body{font-size:14px;line-height:1.42}
}

/* full-page fixed background (the live site's "backstretch" image) */
body::before{content:"";position:fixed;inset:0;z-index:-1;background:url(/img/page-bg.jpg) center/cover no-repeat;pointer-events:none}