/* BS5 Defaults ---------------------

-- grid-breakpoints
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px
  

---------------------------------- */

/*
BREED COLOUR PALETTE -------------
CYAN #2FAADE
MAGENTA #E3097E
YELLOW #FDEA14

*/




/* GLOBAL VARIABLES
---------------------------------- */
/* Colors */
:root {
	--bs-primary: #2FAADE;
	--bs-secondary: #ff4400;
	--bs-link-color: #2FAADE;
	--bs-link-hover-color: #ff4400;

	--color: #000000;
	--reverse-color: #999999;
	--comp-color: #ff4400;
	
	--cyan: #2FAADE;
	--comp: #D05521;
	--orange: #ff4400;
	--magenta: #E3097E;
	--yellow: #FDEA14;
	--dark-tint: #343A40;
	--navbar-height: 118px;  /* SET THIS DYNAMICALLY WITH JAVASCRIPT !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
	--subnav-height: 64px;  /* SET THIS DYNAMICALLY WITH JAVASCRIPT !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
	--dark-grey: #343A40;
	
	--vwunit: 0.9vw;
	--pad-unit: 1.5rem;  /* Start the same as BS gutter */
	--margin-x: var(--pad-unit);
	--border-rad-xs: 16px;
	--border-rad-sm: 24px;
	--border-rad-md: 3rem;
	/* Shadow set for all round corner boxes */
	--global-shadow: 0 .375rem 1.5rem 0 rgba(140,152,164,.125);
	--navbar-height: 80px;
}

@media (min-width: 992px) {
:root {
	--navbar-height: 118px;
}
}

@media (max-width: 383px) {
:root {
	--navbar-height: 68px;
}
}


@media (min-width: 1400px) {
:root {
	--margin-x: 6vw;
}
}


/* BOOTSTRAP VARIABLES
---------------------------------- */

.btn {
  --bs-btn-padding-x: 0.75rem;
  --bs-btn-padding-y: 0.375rem;
  --bs-btn-font-family: ;
  --bs-btn-font-size: 1rem;
  --bs-btn-font-weight: 400;
  --bs-btn-line-height: 1.5;
  --bs-btn-color: #212529;
  --bs-btn-bg: transparent;
  --bs-btn-border-width: 1px;
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 19px; /*MRLL */
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
  display: inline-block;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family);
  font-size: var(--bs-btn-font-size);
  font-weight: var(--bs-btn-font-weight);
  line-height: var(--bs-btn-line-height);
  color: var(--bs-btn-color);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  border-radius: var(--bs-btn-border-radius);
  background-color: var(--bs-btn-bg);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-lg {
  --bs-btn-padding-y: 0.5rem;
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 1.25rem;
  --bs-btn-border-radius: 24px;
}


.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--cyan);
  --bs-btn-border-color: var(--cyan);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--comp-color);
  --bs-btn-hover-border-color: var(--comp-color);
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--comp-color);
  --bs-btn-active-border-color: var(--comp-color);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
  font-weight: 700;
}

.btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--orange);
  --bs-btn-border-color: var(--orange);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--cyan);
  --bs-btn-hover-border-color: var(--cyan);
  --bs-btn-focus-shadow-rgb: 130, 138, 145;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--cyan);
  --bs-btn-active-border-color: var(--cyan);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #6c757d;
  --bs-btn-disabled-border-color: #6c757d;
    font-weight: 700;
}
.btn-rsd {
	font-weight: 700;
	color: #fff;
    background-color: var(--orange);
    border-color: var(--orange);
 }
 .btn-rsd:hover {
	color: var(--cyan);
    background-color: #fff;
    border-color: #fff;
}



/* RESET MAILIL CHIMP CSS BEFORE BTNS */

/* MailChimp Form Embed Code - Classic - 12/17/2015 v10.7 */
/* #mc_embed_signup form {display:block; position:relative; text-align:left; margin: 20px} 
#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}
#mc_embed_signup input {border: 1px solid #ABB0B2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}
#mc_embed_signup input[type=radio]{-webkit-appearance:radio;}
#mc_embed_signup input:focus {border-color:#333;} 
#mc_embed_signup .button {clear:both; background-color: #111; border: 0 none; border-radius:4px; transition: all 0.23s ease-in-out 0s; color: #FFFFFF; cursor: pointer; display: inline-block; font-size:15px; font-weight: normal; height: 32px; line-height: 32px; margin: 0 5px 10px 0; padding: 0 22px; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: fit-content; width: -moz-fit-content;}
#mc_embed_signup .button:hover {background-color:#222;}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;} */

#mc_embed_signup .mc-field-group {clear:left; position:relative;  padding-bottom:4px; min-height:40px; display:grid;} 
#mc_embed_signup .size1of2 {clear:none; float:left; display:inline-block; width:46%; margin-right:4%;}
#mc_embed_signup .mc-field-group label {display:block; margin-bottom:3px;}
#mc_embed_signup .mc-field-group input { display:block; width:100%; padding:4px 0; text-indent:2%; border: solid var(--cyan) 2px; } 

/* #mc_embed_signup .mc-field-group select {display:inline-block; width:99%; padding:5px 0; margin-bottom:2px;}
#mc_embed_signup .mc-address-fields-group {display:flex; flex-direction:row; justify-content:space-evenly; width:96%; gap:15px;}
#mc_embed_signup .mc-sms-phone-group {display:flex; flex-direction:row; justify-content:space-evenly; width:96%; gap:15px; padding-top:5px;}

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us{padding:5px 0;}
#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input{display:inline; width:60px; margin:0 2px; letter-spacing:1px; text-align:center; padding:5px 0 2px 0;}
#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input{width:40px;}
#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input{width:30px;}
#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label{display:none;} */

#mc_embed_signup .indicates-required {text-align:right; font-size:11px; margin-right:4%;}
#mc_embed_signup .asterisk {color: var(--cyan); font-size:150%; font-weight:normal; position:relative; top:5px;}     
#mc_embed_signup .clear {clear:both;}
#mc_embed_signup .foot {display:grid; grid-template-columns: 3fr 1fr; width:96%; align-items: center;}

@media screen and (max-width:400px) {#mc_embed_signup .foot {display:grid; grid-template-columns: 1fr; width:100%; align-items: center;}}

/*
@media screen and (max-width:400px) {#mc_embed_signup .referralBadge {width:50%;}}
#mc_embed_signup .brandingLogo {justify-self:right;}
@media screen and (max-width:400px) {#mc_embed_signup .brandingLogo {justify-self:left;}}
#mc_embed_signup .mc-field-group.input-group ul {margin:0; padding:5px 0; list-style:none;}
#mc_embed_signup .mc-field-group.input-group ul li {display:block; padding:3px 0; margin:0;}
*/
#mc_embed_signup .mc-field-group.input-group label {display:inline;}
#mc_embed_signup .mc-field-group.input-group input {display:inline; width:auto; border:none;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%; margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}
#mc_embed_signup .helper_text {color: var(--orange); margin-top: 2px; display: inline-block; padding: 3px; background-color: rgba(255,255,255,0.85); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 14px; font-weight: normal; z-index: 1;}
#mc-embedded-subscribe {clear:both; width:auto; display:block; } /* margin:1em 0 1em 5%; */
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}
#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {display:inline-block; margin:2px 0 1em 0; padding:3px; background-color:rgba(255,255,255,0.85); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size:14px; font-weight:normal; z-index:1; color:var(--orange);}
#mc_embed_signup #mc-embedded-subscribe-form input.mce_inline_error {border:2px solid var(--orange);}


/* OVERIDE */

/* mailchimp */
#mc_embed_signup {background:#fff; false;clear:left;  width: 600px;}
#mc-embedded-subscribe-form input[type=checkbox]{display: inline; width: auto;}
#mergeRow-gdpr {margin-top: 8px;}
#mergeRow-gdpr fieldset label {font-weight: normal;}
#mc-embedded-subscribe-form .mc_fieldset{border:none;min-height: 0px;padding-bottom:0px;}
.content__gdpr > p, .content__gdprLegal > p {
	font-size: 0.8rem;
	line-height: 1;
}
	

.form-control:focus {
  color: var(--cyan);
  background-color: var(--bs-body-bg);
  border-color: var(--cyan);
  outline: 0;
  box-shadow: none;
}





body {
	/* font-family: "proxima-nova", Helvetica, Arial, sans-serif; */
  color: var(--color);
  font-weight: 400;
  font-family: degular, sans-serif;
  
/*   padding-top: var(--navbar-height);  */

}


/* GLOBAL Typography
-------------------------------------------------- */

:root {
	--type-md: 150%;
	--type-lg: 200%;
}	
@media (min-width:768px) and (max-width:991px) {
:root {
	--type-md: 130%;
	--type-lg: 160%;
}
/* p.type-md { line-height: 1.1; } */
}	

@media (max-width:767px) {
:root {
	--type-md: 110%;
	--type-lg: 130%;
}
}	


body p  {
	--bs-body-line-height: 1.1;
}
  
.type-md p, .type-md li, .type-md figcaption, p.type-md { font-size: var(--type-md); }	
.type-lg p, p.type-lg { font-size: var(--type-lg); }	
	
/* Home page boxes  */
.feature-text p { font-size: 120%; line-height: 1.1; }	
	
@media (min-width:767px) {
	.feature-text p { font-size: 120%; line-height: 1.1; }	
}
@media (min-width:992px) {
	.feature-text p { font-size: 140%; line-height: 1.2; }	
}
@media (min-width:1200px) {
	.feature-text p { font-size: 160%; line-height: 1.4; }	
}
.hero-box p:last-child {margin-bottom: 0; }
	
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.display-0, .display-1, .display-2, .display-3, .display-4 {
  font-weight: 700;
  color: inherit;
}

.display-0 { font-size: 7vw; }

/* Set display same as h2 for small screens */
.display-2 {
font-size: calc(1.325rem + .9vw);
}
@media (min-width:576px) {
	.display-2 { font-size: 4vw; }
}


/* .display-blob {
	font-size: 6vw;
}
@media screen and (orientation: portrait) {
	.display-blob {
	font-size: 12vw;
}
}*/

a, a:hover { text-decoration: none; }



/* 
.multi-column h3 {
	margin-top: var(--bs-gutter-x);
}
*/


/* Navbar
-------------------------------------------------- */

.dropdown-menu {
  --bs-dropdown-zindex: 1031; /*  Make sure this sits above Service sub-menu */
  }
  
.navbar { 
	padding-top: 0;
	padding-bottom: 0;
	/* background-color: var(--dark-tint);
	color: var(--reverse-color); */
}

.navbar-nav {
 /*  --bs-nav-link-padding-x: 0;
  --bs-nav-link-padding-y: 0.5rem;
  --bs-nav-link-font-weight: ;
  --bs-nav-link-color: var(--bs-navbar-color);
  --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
  --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color); */
  --bs-nav-link-font-size: 1rem;
  list-style: none;
  	border: solid 8px transparent;
	background-color: transparent;
	border-radius: 32px;
	align-items: center;
	transition-property: background-color, border-color;
	transition-duration: 0.3s;
	padding-left: 1rem;
}

.navbar-brand {
	text-indent: -9999px;
	display: block;
	background: transparent url(../img/breed-logo_366x86.svg) no-repeat left center;
	background-size: 366px 86px;
	width: 400px;
	height: 102px;
	border: transparent solid 8px;
	border-radius: 51px;
	margin: 8px 0;
	transition-property: background-color, border-color;
	transition-duration: 0.3s;
}
/* white nav bg always on caontact page */
.contact .navbar .navbar-nav, .contact .navbar .navbar-brand {
  	border-color: #fff;
	background-color: #fff;
}
/* Add .opaque class to nav to remove oval containers on page load */
@media (min-width: 992px) {
.navbar.opaque .navbar-nav, .navbar.opaque .navbar-brand, #prices .navbar-nav, #prices .navbar-brand {
  border-color: #fff;
  background-color: #fff;
}
} /* /@media */
@media (max-width: 991px) {
	.navbar .navbar-nav, .navbar .navbar-brand {
  	border-color: #fff;
	background-color: #fff;
}
} /* /@media */


.nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: #000000;
  text-decoration: none;
  transition: color .15s ease-in-out;
}
.dropdown-toggle::after {
  display: inline-block;
  vertical-align: .15em;
 }
  

@media (min-width: 992px) {
.navbar-expand-lg .navbar-nav .nav-link {
  --bs-navbar-nav-link-padding-x: 16px;
  }
} /* /@media */


.tel-number {
/* display: inline-block;
	text-indent: -1000px;
	overflow: hidden;
	top: 0;
	right: 0; */
	position: relative;
	width: 48px;
	height: 48px;
}
.tel-link {
	display: inline-block;
	text-indent: -200px;
	overflow-x: hidden;
	width: 48px;
	height: 48px;
	border-radius: 24px;
	overflow: hidden;
	background: var(--cyan) url(../img/tel_32x32.svg) no-repeat center center;
	background-size: 32px 32px;
}
.tel-link:hover {
	background-color: var(--comp-color);
}
/* .tel-number:before {
	content: "+44 1142 552460";
	  font-size: var(--bs-nav-link-font-size);
	  font-weight: var(--bs-nav-link-font-weight);
	  padding-top: 6px;
	  padding-left: 6px;
	color: #fff;
	background-color: var(--comp-color);
	position: absolute;
	right: 0px;
	top: 0;
	display: block;
	height: 48px;
	width: 240px;
	border-radius: 24px;
} */

.navbar-toggler {
  font-size: 1.25rem;
  line-height: 1;
  background-color: transparent;
  border: none;
  border-radius: 0;
}

.navbar-toggler:hover, .navbar-toggler:focus {
  text-decoration: none;
}

@media (min-width: 1200px) {
.navbar-nav {
  --bs-nav-link-font-size: 1.25rem;
  }
}

@media (min-width: 1400px) {
.navbar-nav {
  --bs-nav-link-font-size: 1.5rem;
  }
}


/* HAMBURGER courtesy of https://jonsuh.com/hamburgers/ */
/* Full range of burger styles in hamburgers.css in the css folder */

.hamburger {
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  padding: 0.25rem 0.75rem;
  margin-right: -10px; /* align with right content whilst retaining hit area */
  overflow: visible;  
}
/* .hamburger:hover {
    opacity: 0.7; }
.hamburger.is-active:hover {
    opacity: 0.7; } */
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: var(--cyan); }

.hamburger-box {
  width: 30px;
  height: 24px;
  display: inline-block;
  position: relative; 
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 30px;
    height: 3px;
    background-color: var(--cyan);
    border-radius: 0;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; 
    }
.hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; 
    }
.hamburger-inner::before {
    top: -10px; 
    }
.hamburger-inner::after {
    bottom: -10px; 
    }
    
/* Squeeeze variant */
.hamburger--squeeze .hamburger-inner {
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 
  }
.hamburger--squeeze .hamburger-inner::before {
    transition: top 0.075s 0.12s ease, opacity 0.075s ease; 
    }
.hamburger--squeeze .hamburger-inner::after {
    transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); 
}

.hamburger--squeeze.is-active .hamburger-inner {
  transform: rotate(45deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 
}
.hamburger--squeeze.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.075s ease, opacity 0.075s 0.12s ease; 
}
.hamburger--squeeze.is-active .hamburger-inner::after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); 
}
/* /squeeeze */

button.hamburger:focus { outline: none; }	

.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: none;
}







/* DROPDOWN vars  ============ */
@media screen and (min-width: 992px) {
.dropdown-menu {
  --bs-dropdown-zindex: 1000;
  --bs-dropdown-min-width: 10rem;
  --bs-dropdown-padding-x: 0;
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-spacer: 0.125rem;
  --bs-dropdown-font-size: 1rem;
  --bs-dropdown-color: var(--color);
  --bs-dropdown-bg: #fff;
  --bs-dropdown-border-color: #fff; /*MRLL*/
  --bs-dropdown-border-radius: 0.12px; /*MRLL*/
  --bs-dropdown-border-width: 2px; /*MRLL*/
  --bs-dropdown-inner-border-radius: calc(0.5rem - 2px); /*MRLL*/
  --bs-dropdown-divider-bg: var(--bs-border-color-translucent);
  --bs-dropdown-divider-margin-y: 0.5rem;
  --bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-dropdown-link-color: #212529;
  --bs-dropdown-link-hover-color: var(--comp-color);
  --bs-dropdown-link-hover-bg: #fff;
  --bs-dropdown-link-active-color: #fff; /*MRLL*/ 
  --bs-dropdown-link-active-bg: var(--comp-color); /*MRLL*/
  --bs-dropdown-link-disabled-color: #adb5bd;
  --bs-dropdown-item-padding-x: 1rem;
  --bs-dropdown-item-padding-y: 0.25rem;
  --bs-dropdown-header-color: #6c757d;
  --bs-dropdown-header-padding-x: 1rem;
  --bs-dropdown-header-padding-y: 0.5rem;
  position: absolute;
  z-index: var(--bs-dropdown-zindex);
  display: none;
  min-width: var(--bs-dropdown-min-width);
  padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
  margin: 0;
  margin-top: 0px;
  font-size: var(--bs-dropdown-font-size);
  color: var(--bs-dropdown-color);
  text-align: left;
  list-style: none;
  background-color: var(--bs-dropdown-bg);
  background-clip: padding-box;
  border: none;
  border-bottom-right-radius: 12px;
  border-bottom-left-radius: 12px;
}
}


/* DROPDOWN HOVER - We set dropdown nav to hover for pointer screens above 992px width  ============ */
@media screen and (min-width: 992px) and (pointer: fine) {
	.navbar .dropdown-menu-end{ right:0; left: auto;  }
	.navbar .nav-item .dropdown-menu{  display:block; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;  }
	.navbar .nav-item:hover .nav-link{ color: #ff4400;  }
	.navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
	.navbar .dropdown-menu.fade-up{ top:180%;  }
	.navbar .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
}


/* OFFCANVAS MENU - Styles for off canvas menu layout */	

@media (max-width: 991px) {
  .navbar-collapse {
    position: fixed;
    top: var(--navbar-height); 
    bottom: 0;
    left: 100%;
    width: 100%;
    padding: calc(0.5 * var(--bs-gutter-x));
    overflow-y: auto;
    visibility: hidden;
    text-align: center;
    transition: visibility .4s ease-in-out, transform .4s ease-in-out;
 }
.navbar-collapse.show {
    visibility: visible;
    transform: translateX(-100%);
    z-index: 1000;
 }

.navbar-nav { 
	height: 100%;
	position: relative; 
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* overide dropdown menu closed */
.dropdown-menu { 
	display: block; 
	border: none; 
	text-align: center;
	padding: 0;
}
.nav-link.dropdown-toggle, .dropdown-toggle::after { display: none; }


/* Style the same */
.navbar-nav .nav-link, .navbar-nav .dropdown-item  {
	color: #000000;
	font-size: 2rem;
	padding: 0.25rem 0px;
}
.nav-link:hover, .dropdown-item:hover, .dropdown-item:focus, .dropdown-item:active  {
	color: var(--comp-color);

}	
.tel-number { margin-top: 1rem; }	

.hamburger {
  background-color: #fff;
  padding: 0.5rem 0.25rem 0.25rem 0.25rem ;
  border: transparent solid 6px;
  border-radius: 26px;
  width: 52px;
  height: 52px;
  margin: 0;
  margin-right: 0px; /* align with right content whilst retaining hit area */
  overflow: visible;  
}


} /* /@media */


/* mobile sizes */


@media (max-width: 991px) {

.navbar-brand {
	background-size: 244px auto;
	width: 256px;
	height: 64px;
	border: transparent solid 6px;
	border-radius: 32px;
	margin: 8px 0;
}
.navbar-nav .nav-link,  .navbar-nav .dropdown-item  {
	color: #000000;
	font-size: 1.5rem;
	padding: 0.125rem 0px;
}
} /* /@media */

/* very narrow */
@media (max-width: 383px) {
.navbar-brand {
	background-size: 216px auto;
	width: 240px;
	height: 56px;
	border: transparent solid 5px;
	border-radius: 28px;
	margin: 6px 0;
}
} /* /@media */



@media (max-width: 991px) and (max-height: 600px) {
.navbar-nav .nav-link, .navbar-nav .dropdown-item  {
	font-size: 1.2rem;
}
} /* /@media */











/* GLOBAL STYLES
-------------------------------------------------- */

/* Add nav padding to whole page when using smooth scroll 
#smooth-content {
	padding-top: var(--nav-height);
}
*/


hr {
/* margin: 1rem 0;
  color: inherit;
  border: 0;
    border-top-width: 0px;
    border-top-style: none;
    border-top-color: currentcolor; */
  border-top: 2px solid var(--cyan);
  opacity: 1;
}



/* Set fluid containers below 1400px */

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 100%;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 100%;
  }
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 100%;
  }
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320%;

  }
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
}

:root { 
	 --pad-unit: 1.5rem;
}

/* Margins for fluid containers */

@media screen and (min-width: 768px) and (max-width: 1400px) {
.row {
margin-right: 0px;
margin-left:  0px;		
	}
} /* /@media */
@media screen and (min-width: 1200px) {
/* :root { 
	 --pad-unit: 3rem;
} */
} /* /@media */

/* Margins for fluid containers */
@media screen and (min-width: 1400px) {
.row * {
/*   --bs-gutter-x: 3rem; /* Give columns more space */
}

} /* /@media */





.main-content { /* All the content between Splash/Banner and Footer */
	/* background: #eeeeee url(../img/breed-blobs.svg) repeat-y center -5vh;
	background-size: 120vw auto; */
	position: relative;
	padding: calc(2 * var(--pad-unit)) 0px ; 
}
@media screen and (max-width: 767px) {
.main-content {
	padding-right: var(--bs-gutter-x);
	padding-left: var(--bs-gutter-x);
}
}	
.margin-x {
	padding-right: var(--margin-x);
	padding-left: var(--margin-x);
}
.margin-l {
	padding-left: var(--margin-x);
}
/* .margin-x > .row {
	--bs-gutter-x: 0; */
}
.margin-y { /* Spacing between each section added as bottom padding */
	padding-bottom: calc(2 * var(--pad-unit));
}	



@media screen and (max-width: 575px) {
.margin-x {
 padding-right: calc(0.5 * var(--bs-gutter-x));
	padding-left: calc(0.5 * var(--bs-gutter-x)); 
}
} /* /@media */
.infront { position: relative; z-index:1; }


.splash {
  position: relative;
  height: 100vh;
  overflow: hidden;
  padding-right: 0px;
  padding-left: 0px;
}
.splash-200 { height: 200vh; }
.splash-75 { height: 75vh; }
.splash-50 { height: 50vh; }

/* Add this to SVG img to fix IE10 bug */
.svg-fluid {
	width: 100% \9;
}

.img-wrap {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.img-wrap.auto {padding-bottom: 0px; height: auto; overflow: auto;}
.img-wrap.ratio-3-2 { padding-bottom: 66.666%; height: 0; }
.img-wrap.ratio-2-1 { padding-bottom: 50%; height:0; }
.img-wrap.ratio-1-1 { padding-bottom: 100%; height:0; }

.img-wrap  img {
	position: absolute;
    top: 0;
    left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* square-crop-image */
.img-wrap-square {
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 100%;
    overflow: hidden;
}

.img-wrap-square > img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.border-rad > * {
	border-radius: var(--border-rad-sm);
}
.tl-rad  {
	border-top-left-radius: var(--border-rad-sm);
	overflow: hidden;
}
.tlbr-rad  {
	border-top-left-radius: var(--border-rad-sm);
	border-bottom-right-radius: var(--border-rad-sm);
	overflow: hidden;
}
.bl-rad  {
	border-bottom-left-radius: var(--border-rad-sm);
	overflow: hidden;
}

.cover {
	position: absolute;
	inset: 0;
}
.cover.behind {
	z-index: -1;
}

.cover.one {
	right: 66.6666vw;
}
.cover.two {
	left: 33.3333vw;
	right: 33.3333vw;
}
.cover.three {
	left: 66.6666vw;
}
.cover  img, .cover > canvas {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cover.top  img {
	object-position: center top;
}

/* Make sure white at top of image is visible on letter box viewport */
@media screen and (min-aspect-ratio: 15/9) {
.splash .cover img {
	object-position: center top;
}

.splash.blog-splash .cover img {
	object-position: center center;
}

}
.splash-75 .cover img {
	object-position: center top;
}



.main-col {
	margin-bottom: var(--bs-gutter-x);
}

.side-col, .copy-col, .blog-wrap {
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	padding: var(--pad-unit);
	margin-bottom: var(--pad-unit);
	box-shadow: var(--global-shadow);
}
.picture-box {
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	padding: var(--pad-unit);
	padding-bottom: calc(0.5 * var(--pad-unit));
	margin-bottom: var(--bs-gutter-x);
	box-shadow: var(--global-shadow);
}
.picture-box > span {
	display: inline-block;
	padding-top: 0.25rem;
}
/* Dimensions as above but no box*/
.copy-box {
	padding: var(--pad-unit);
	padding-bottom: calc(0.5 * var(--pad-unit));
	margin-bottom: var(--bs-gutter-x);
}








/* START NEW STADARDS FOR BOXES 
.col-wrap-box {
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	padding: var(--pad-unit);
	margin-bottom: var(--pad-unit);
	box-shadow: var(--global-shadow);
}
*/




.order-box {
	/* padding-top: calc(0.5 * var(--bs-gutter-x)); */
}

.faq-wrap {
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	padding: var(--pad-unit);
	margin-bottom: var(--bs-gutter-x);
	box-shadow: var(--global-shadow);
}
/* Used for footer */
.mini-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	background-color: #fff;
	border-radius: var(--border-rad-xs);
	min-height: calc(2 * var(--border-rad-xs));
	padding-right: calc(0.5 * var(--bs-gutter-x));
	padding-left: calc(0.5 * var(--bs-gutter-x));
	margin-bottom: calc(0.5 * var(--bs-gutter-x));
	box-shadow: 0 .375rem 1.5rem 0 rgba(140,152,164,.125);
}
.mini-nav > a {
	color: #000000;
	text-decoration: none;
	margin: 0px 0.5rem;
}
.mini-nav > a:hover { color: var(--comp-color);}
.mini-nav > a:first-child {
	margin-left: 0px;
}
.mini-nav > a:last-child {
	margin-right: 0px;
}
.btn-sm {
	min-width: 100px;
}
@media screen and (max-width: 991px) {
.mini-nav { justify-content: center; }
}




/* Link Boxes */
a.box-link, div.box-link {
	color: var(--color);
	text-decoration: none;
}
/* compact space in link boxes */
.box-link h4 {
	margin-bottom: 0.3rem;
}
.box-link p { margin-bottom: calc(0.5 * var(--bs-gutter-x)); } 
.box-link h4 { margin-top: 0.3rem; }
.box-link .img-wrap { margin-bottom: calc(0.5 * var(--bs-gutter-x)); }
.box-link img { 
	transition: transform ease-in-out 0.2s; 
	transform: scale(1);
	transform-origin: bottom right;
}

/* hover states for button and img when box activated */
a.box-link:hover .btn {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
a.box-link:hover img {
   transform: scale(1.1);
}

/* hover states for button and img when box activated */
div.box-link:hover { cursor: pointer; }
div.box-link:hover img { transform: scale(1.1); }



/* to stay visible with blob */

/* .diff p  a, .diff li > a { mix-blend-mode: difference; color: var(--cyan); }
.diff p  a:hover, .diff li > a:hover { mix-blend-mode: normal; color: var(--orange);} */

.diff p  a, .diff li > a { background-color: rgba(255, 255, 255, 0.5); }
.diff p  a:hover, .diff li > a:hover { background-color: rgba(255, 255, 255, 0.5);}



.form-control {
  display: block;
  width: 100%;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 2px solid var(--cyan);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: var(--border-rad-xs);
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.form-control:focus {
  color: #212529;
  background-color: #fff;
  border-color: var(--cyan);
  border-width: 4px;
  outline: 0;
  box-shadow: none;
}



/* universal classes */

.border-box {
  background-color: #fff;
  border-radius: var(--border-rad-sm);
  padding: var(--pad-unit);
  margin-bottom: var(--pad-unit);
  box-shadow: 0 .375rem 1.5rem 0 rgba(140,152,164,.125);
}

.img-wrap.rat-16x9 {
  position: relative;
  display: block;
  height: 0px;
  padding-top: 56.25%;
  overflow: hidden;
}


/* SERVICES / PRODUCT subNAV -
-------------------------------------------------- */

.service-sub-nav {
  position: absolute;
  top: calc(100vh - 64px); /* 64 = nav height plus 1rem */
  right: 0;
  left: 0;
  z-index: 1020;
} 

.service-sub-nav.fixit {
	position: fixed;
	top: var(--navbar-height);
	right: 0;
	left: 0;
	z-index: 1020;
}
	
.sub-navbar {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	background-color: #fff;
	background-color: var(--cyan);
	/* border: #fff solid 8px; */
	height: 48px;
	padding-left: 8px;
	border-radius: 24px;
}

a.sub-link {
	color: #fff;
	text-decoration: none;
	display: block;
}


@media (min-width: 1200px) {
a.sub-link {
  font-size: 1.25rem;
  }
}

@media (min-width: 1400px) {
a.sub-link {
  font-size: 1.5rem;
  }
}


a.sub-link:hover {
	color: var(--comp-color)
}
@media screen and (max-width: 991px) {
	.service-sub-nav { display: none; }
}





/* SERVICES and PRODUCT pages
-------------------------------------------------- */

:root {
	--border-rad-lg: 24px;
}

.hero {
	margin-top: calc(1.2 * var(--navbar-height));
}
.hero-box {
	background-color: rgba(256,256,256,1);
	border-radius: var(--border-rad-lg);
	padding: var(--pad-unit);
	max-width: 1400px;
}
.hero-cta {
	margin-top: 2vh;
}

.mask-right {
	position: absolute;
	top: var(--navbar-height);
	right: 0px;
	bottom: var(--navbar-height);
	bottom: 80px;
	left:50%;
	background-color: transparent;
}
.mask-right > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
-webkit-mask-image: url(../img/blob-mask-01.svg);
-webkit-mask-position: left center;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 66vw;
    mask-image: url(../img/blob-mask-01.svg);
  mask-position: left center;
  mask-repeat: no-repeat;
  mask-size: 66vw;
  background-color: transparent;
}

@media screen and (max-width: 767px) {
	.mask-right { display: none; }
}

/* Containing Div for Product details */
.product-includes {
	padding-top: var(--navbar-height);
	padding-bottom: var(--navbar-height);
	padding-left: calc(var(--margin-x) + var(--bs-gutter-x));
}


h2.product-summary {
	font-weight: 300;
	font-size: 1.5rem;
}


@media (min-width: 1200px) {
h2.product-summary {
  font-size: 1.75rem;
  }
}

@media (min-width: 1400px) {
h2.product-summary{
  font-size: 2rem;
  }
}








ul.product-list { margin-top: 1rem; }

.product-includes ul {
   list-style: none; 
  padding-left: calc(0.5 * var(--bs-gutter-x));
  border-left: 2px solid var(--cyan);
   margin-top: 1rem;
}

/* Service page boxes */
.options-list, .product-options ul { padding-left: 0; }
.options-list > li, .product-options li {
	display: inline;
	padding-right: 0.5rem;
	font-size: var(--type-md);
}
.product-options li:after {
	content: "•";
	padding-left: 0.5rem;
}
.box-img {
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 66.6%;
    overflow: hidden;
    border-radius: 2rem;
}

.box-img > img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

a.service-link {
	color: var(--color);
	text-decoration: none;
	
}
.box-overlay {
	padding-top: calc(0.25 * var(--bs-gutter-x));
	padding-right: calc(0.5 * var(--bs-gutter-x));
	padding-bottom: calc(0.5 * var(--bs-gutter-x));
	padding-left: calc(0.5 * var(--bs-gutter-x));
}

#cta2 {
  z-index: 1020;
}
/* remove third box on 2 col version */
@media (min-width:768px) and (max-width:991px) {
.examples .col-md-6:last-child {
	display: none;
}
} /* /@media */


/* FAQ 
------------------------------------------------------- */

/* Accordion Vars */

.accordion {
  --bs-accordion-color: #000000; /*MRLL*/
  --bs-accordion-bg: transparent; /*MRLL*/
  --bs-accordion-transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;
  --bs-accordion-border-color: var(--cyan); /*MRLL*/
  --bs-accordion-border-width: 2px; /*MRLL*/
  --bs-accordion-border-radius: 0.375rem;
  --bs-accordion-inner-border-radius: calc(0.375rem - 1px);
  --bs-accordion-btn-padding-x: 1.25rem;
  --bs-accordion-btn-padding-y: 0.5rem; /*MRLL*/
  --bs-accordion-btn-color: #000; /*MRLL*/
  --bs-accordion-btn-bg: transparent; /*MRLL*/
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232faade'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); /*MRLL changed chevron color */
  --bs-accordion-btn-icon-width: 1.25rem;
  --bs-accordion-btn-icon-transform: rotate(-180deg);
  --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff4400'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); /*MRLL changed chevron color */
  --bs-accordion-btn-focus-border-color: transparent; /*MRLL*/
  --bs-accordion-btn-focus-box-shadow: none;
  --bs-accordion-body-padding-x: 1.25rem;
  --bs-accordion-body-padding-y: 0rem;
  --bs-accordion-active-color: var(--comp-color);
  --bs-accordion-active-bg: transparent;
}
.accordion-button {
  font-size: 1.5rem; /* Same as h3 */
  font-weight: 300;
  padding-left: 0;
}
.accordion-flush .accordion-item:last-child {
  border-bottom: solid var(--cyan) 2px;
}
.accordion-button:hover {
	color: var(--cyan);
}
.accordion-body {
	padding-left: 0px;
	padding-right: calc(2 * var(--bs-accordion-body-padding-x));
}




/* CREATIVE PACKAGING 
------------------------------------------------------- */
.bespoke {
/* margin-bottom: calc(3 * var(--pad-unit)); */
}

.bespoke > .row {
	margin-bottom: var(--pad-unit);
}



.copy-box ul {
   list-style: none; 
  padding-left: calc(0.5 * var(--bs-gutter-x));
  border-left: 2px solid var(--cyan);
   margin-top: 1rem;
}


figcaption.b-caption {
	/*.  border-left: solid 2px var(--cyan); */
	padding-top: 0.5rem;
	font-weight: 300;
	font-size: 125%;
	line-height: 1;
}

/* Simple Ticker 

.ticker-wrap {
  font-weight: 700;
  font-size: 5vw;
  width: 100%;
  margin: 0 auto;
  padding-left: var(--margin-x);
  overflow: hidden;
  white-space: nowrap;
}
.ticker {
  display: inline-block;
  margin-top: 5px;
}
.item-collection-1 {
  position: relative;
  left: 0%;
}
.item-collection-1 {
	display: none;
}
.item {
  display: inline-block;
  padding: 0 2vw;
}
 */




/*  MOving Ticker */
.ticker-wrap {
  font-weight: 700;
  font-size: 5vw;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  white-space: nowrap;
 /* height: 3.5rem; */
}
.ticker {
  display: inline-block;
  margin-top: 5px;
  /* transform: translateX(-5vw); */
   animation: marquee 20s linear infinite; 
}
.item-collection-1 {
  position: relative;
  left: 0%;
   animation: swap 20s linear infinite; 
}
.item {
  display: inline-block;
  padding: 0 2vw;
}

/* Transition */
@keyframes marquee {
  0% {
    transform: translateX(0)
  }
  100% {
    transform: translateX(-100%)
  }
}

@keyframes swap {
  0%, 50% {
    left: 0%;
  }
  50.01%,
  100% {
    left: 100%;
  }
}






/* STYLES FOR TEMPORARY SERVICE PAGES 
------------------------------------------------------- */


.ts-service-box {
  background-color: #fff;
  border-radius: var(--border-rad-sm);
  padding: var(--pad-unit);
  margin-bottom: var(--pad-unit);
  margin-left: 0;
  margin-right: 0;
  box-shadow: 0 .375rem 1.5rem 0 rgba(140,152,164,.125);
  display: flex;
}

.ts-product-info-box {
	padding-left: var(--bs-gutter-x);
	height: 100%;
	overflow-y: scroll;
}
h4.ts-product-name {
	
}

.ts-product-info-box > p:first-of-type {
	font-size: 125%;
}
.ts-product-info-box > ul {
	list-style: none;
	padding-left: calc(0.5 * var(--bs-gutter-x));
	border-left: 2px solid var(--cyan);
}

@media (max-width:767px) {
.ts-product-info-box  { padding-left: 0px; }
}





/* TESTIMONIALS 
------------------------------------------------------- */


.blockquote-wrap {
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	padding: var(--pad-unit);
	margin-bottom: var(--pad-unit);
	box-shadow: var(--global-shadow);
}

.blockquote-footer {
  margin-top: -1rem;
  margin-bottom: 0px;
  font-size: .875em;
  color: #6c757d;
}







/* CONTACT
------------------------------------------------------- */
#map {
  height: 75vh;
}
/* Position h1 here */
.hero-box.contacto {
	position: absolute;
	left: var(--margin-x);
	bottom: var(--pad-unit);
	max-width: 1400px;
}
@media (min-width:1400px) {
.hero-box.contacto { left: calc((100vw - 1290px) * 0.5);}
}

.org.h2 {
	text-indent: -9999px;
	background: transparent url(../img/breed-logotype_512x64.svg) no-repeat left center;
	background-size: auto 22px;
	margin-bottom: 1px;
}

/* Hide bot sniffer */
.sniffer {
	display :none;
}

/*  ??????
	
.col.contact {
	margin-left: 50vw;
	margin-top: calc(2rem + var(--navbar-height));
	padding-right: var(--margin-x);
}

.contact-row {
	position: absolute;
	top: 60vh;
	right: var(--margin-x);
	left: var(--margin-x);
}



 */










/* GLOBAL MODAL WINDOW  STYLES - Also used in prices 
-------------------------------------------------- */


.modal-content {
	border-radius: var(--border-rad-sm);
	max-width: 768px;
	overflow: scroll;
	
}
.modal-header {
    border-bottom: none;
    padding: 20px;
    border-radius: 0;
}

#rsd-modal .modal-content {
	overflow-y: scroll;
}






/* PRICES MODAL 
	========================================================= */
	


.price-quote-wrap > span {
	display: block;
	text-align: center;	
}
span.format, span.our-price, span.deal { 
	font-size: 2rem;
	font-weight: bold;
}
span.with {
	font-size:  1.2rem;
	font-style: italic;
	}
span.deal {
	margin-top: 1rem;
}

/* 
.price-form-wrap .form-label {
	font-weight: 400;
	text-transform: uppercase;
}

.price-form-wrap .form-control {
	background-color: #ffffff;
	color: #000;
	border-radius: 0;
}
.price-form-wrap .btn {
	border-radius: 0;
	text-transform: uppercase;
	
}
.price-form-wrap .btn:hover {
	border-color: var(--magenta);
	background-color: var(--magenta);
}

*/












/*  RSD UNSIGNED  
------------------------------------------------------------- */




/* NEW Custom splash NEW */

.splash.splash-rsd-unsigned  { 
	background-color: #fff; 
}
.splash-rsd-unsigned .cover {
	top: var(--navbar-height); 
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: center center;
	/* background-image: url(../img/rsd-closed-banner-landscape.svg), url(../img/rsd-closed-banner-landscape.jpg); */
	/* background-image: url(../img/w-rsd-banner-landscape.svg), url(../img/w-rsd-banner-landscape.jpg); */
	/* background-image: url(../img/rsd24-landscape.svg) ; */
	background-image: url(../img/winner-24-landscape.jpg) ;
	background-size: cover;
}

.rsd-unsigned-2025 .splash-rsd-unsigned .cover { background-image: url(../img/RSDU_WebAsset2_V2_landscape.png) ; }

.splash-rsd-unsigned .cover { background-image: url(../img/RSDU_WebAsset2_V2_landscape.png) ; }


@media (max-width:991px) {
.splash-rsd-unsigned .cover {
	/* background-image: url(../img/rsd-closed-banner-landscape-xtra.jpg); */
	/* background-image: url(../img/w-rsd-banner-landscape-xtra.svg), url(../img/w-rsd-banner-landscape-xtra.jpg); */
	/* background-image: url(../img/rsd24-wide.svg); */
	background-image: url(../img/winner-24-landscape.jpg);
	background-size: auto 100%;
	}
.rsd-unsigned-2025 .splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-landscape.svg) ; }
.splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-landscape.svg) ; }
} /* /@media */	


@media (max-width:991px) and (min-aspect-ratio: 1.5)  {
.splash.splash-rsd-unsigned {
	height: 50vw;
}
}



@media (min-width:992px)    {
.splash-rsd-unsigned .cover {
	/* CLOSED */
	 /* background-image: url(../img/rsd-closed-banner-landscape-xtra.jpg); */
	 /* WINNER */
	/* background-image: url(../img/w-rsd-banner-landscape-xtra.svg), url(../img/w-rsd-banner-landscape-xtra.jpg); */
	/* background-image: url(../img/rsd24-wide.svg); */
	background-image: url(../img/winner-24-xtra-wide.jpg);
	background-size: auto 100%;
	}
.rsd-unsigned-2025 .splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-wide.svg) ;  }
.splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-wide.svg) ;  }
} /* /@media */	

@media (min-width:992px) and (min-aspect-ratio: 1.5) {
.splash.splash-rsd-unsigned {
	height: calc(42vw + 80px);
}
}


@media (min-width:992px) and (min-aspect-ratio: 2.0) {
.splash.splash-rsd-unsigned {
	height: calc(34vw + 80px);
}
}





@media screen and (orientation: portrait) {
	
.splash-75.splash-rsd-unsigned {
 	height: calc(118vw + 80px);
}
.splash-rsd-unsigned .cover {
 /* background-image: url(../img/rsd-closed-banner-portrait-1200.jpg); */
    /* background-image: url(../img/w-rsd-banner-portrait.svg), url(../img/w-rsd-banner-portrait.jpg); */
    /* background-image: url(../img/rsd24-portrait.svg); */
    background-image: url(../img/winner-24-portrait.jpg);
    background-image: url(../img/unsigned-v4-portrait.svg) ;
	background-size: 100%;
}
.rsd-unsigned-2025 .splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-portrait.svg) ; }

.splash-rsd-unsigned .cover { background-image: url(../img/unsigned-v4-portrait.svg) ; }
} /* /@media */

.splash-rsd-unsigned .hero { display: none; }




.rsd-intro {
	text-align: justify;
	max-width: 920px;
	margin-right: auto;
	margin-left: auto;
}


.rsd-blue-bg {
	background-color: var(--cyan);
	color: #fff;
}
.rsd-blue-bg p a {
	background-color: rgba(255,255,255,0.5);
}
p.winner {
	color: #fff;
	font-size: 2.2rem;
	line-height: 1.2;
	margin-bottom: 1.25rem;
}



.rsd-blue-bg ul {
  padding-left: 0;
  list-style: none;
}
.rsd-blue-bg li {
  line-height: 1.2;
  margin-bottom: 0.5rem;
  font-size: var(--type-md);
}



@media  screen and (max-width: 568px) {
	p.winner {
	font-size: 1.8rem;
}
} /* /@media */
	
p.winner > span {
	background-color: var(--cyan);
	padding-right: 1rem;
	padding-left: 1rem;
}
.rules li {
	line-height: 1.2;
	margin-bottom: 0.5rem;
}

/* form */
#rsdModal .modal-content, #rdsModal .modal-content {
	background-color: #fff;
}
.judges p {
	text-align: justify;
}
.judge-pic {
	overflow: hidden;
  width: 220px;
  height: 220px;
  display: inline-block;
  border-radius: 50%;
  border: 2px solid #000000;
  margin-bottom: 3rem;
}
@media  screen and (min-width: 768px) and (max-width: 991px) {
.judge-pic {
	width: 175px;
	height: 175px;
}
}
.judge-pic > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	
}

@media  screen and (max-width: 767px) {
.judge-pic {
	margin-bottom: 0px;
}
} /* /@media */



.third {
	font-variant-numeric: diagonal-fractions;
}





















/* BLOG
------------------------------------------------------- */


.blog-splash {
	height: 75vh;
	background-color: #fff;
}
.blog-splash > .cover {
	top: var(--navbar-height);
}


/* .blog-wrap  on line 991 */

.blog-summary > .img-wrap { margin-bottom: .5rem; }
.postdate { font-style: italic; font-size: 75%; }


.blog-splash .cover:before {
	content: " ";
	display: block;
	position: absolute;
	inset: 0; 
	/* background-color: rgba(0,0,0,0.4); */
}

.blog-post h2, .blog-post h3 {
	margin-top: 3rem;
}
.blog-post h2:first-of-type { margin-top: 0; }
.blog-images {
	margin-bottom: 2rem;
}

.prevnext {
	text-align: center;	
	margin-top: var(--pad-unit);
}
.prev, .next {
	text-transform: uppercase;	
}
.prev {
margin-right: var(--pad-unit);
}

.next {
margin-left: var(--pad-unit);
}

/* Blog Side Nav */

.blog-nav .blog-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) 0;
  text-decoration: none;
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1;
  transition: color .15s ease-in-out;
  border-top: #000 solid 2px;
}
.blog-nav .blog-link:last-child {
	border-bottom: #000 solid 2px;
}
/* HOME 
------------------------------------------------------- */


.home-row {
	padding-top: var(--navbar-height);
	padding-bottom: var(--bs-gutter-x);
	display: flex;
	align-content: flex-end;
}
.hero-wrap {
	position: absolute;
	width: 100%;
	bottom: calc(2 * var(--margin-x) + 48px);
	left: 0;
	padding-right: var(--margin-x);
	padding-left: var(--margin-x); 
}	
.col-box {
	display: flex;
	align-items: center;
/* height: calc(33.3333vw - var(--bs-gutter-x)); */
	/* background: transparent url(../img/blob-mask-01.svg) no-repeat center center; */
	background-size: contain;
}

#vinyl-prices-btn, #cd-prices-btn, #dvd-prices-btn {
	position: absolute;
	bottom: var(--bs-gutter-x);
	left: var(--bs-gutter-x);	
}
#cd-prices-btn { left: calc( 33.333vw + var(--bs-gutter-x));	}
#dvd-prices-btn { left: calc( 66.666vw + var(--bs-gutter-x));	}

/* iPhone detail */
@media screen and (max-width:575px) {
#cd-prices-btn, #dvd-prices-btn { display: none; }
.hero-box p { line-height: 1.1; font-size: 120%; }
} /* /@media */










	
.display-box {
	font-size: 6vw;
	font-weight: 700;
	padding-left: var(--bs-gutter-x);
	background-color: rgba(256,256,256,1);
	border-radius: var(--border-rad-lg);
	padding: var(--pad-unit);
}

















	

@media screen and (orientation: portrait) {
	.display-blob {
	font-size: 12vw;
}
}
span.link {
	border-bottom: solid 0.4vw #000000;
}
span.color-link {
    background-color: #00ff00;
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
}

.features {
	--box-bg: #fff;
	--box-text: #000;
	/*  background-color: var(--cyan); */
}

.row.feature {
	/* Overide BS5 */ 
  --bs-gutter-x: 0;
/* --bs-gutter-y: 0; */
  margin-top: 0;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: var(--pad-unit);
	color: var(--box-text);
	/* background: #fff; */
	/* White bg in centre */
	border-radius: var(--border-rad-sm);
/* background: linear-gradient(90deg, rgba(256,256,256,0) 30%, rgba(256,256,256,1) 30%, rgba(256,256,256,1) 70%, rgba(256,256,256,0) 70%); */
}
.row.feature > div {
	border: 1rem solid #fff;
	border-width: var(--pad-unit);
	overflow: hidden;
	background-color: #fff;
	border-radius: var(--border-rad-sm);
	box-shadow: var(--global-shadow);
	padding: 0;
} 
.feature-img {
	position: relative;
	display: block;
	height: 0px;
	padding-top: 56.25%; /*  16:9 ratio */
	border-top-left-radius: var(--border-rad-sm);
	border-bottom-left-radius: var(--border-rad-sm);
	overflow: hidden;
}
.feature-img  img {
	position: absolute;
	inset: 0px;
}
.feature-text {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	background-color: var(--box-bg);
}

/* Swap shadow */

.row.feature.swop {
   box-shadow: var(--global-shadow);
}
.row.feature.swop > div {
	box-shadow: none;
}



























/* TERMS and CONDITIONS
==================================================================== */


/* .sidebar { 
	position: fixed;
	top: var(--navbar-height);
}
*/




/* SIDE NAV DETAIL */

.navfade {
	opacity: 0;
}
.side-nav {
	position: relative;
}
.side-nav.fix-nav {
	position: fixed;
	top: var(--navbar-height);  
	z-index: 250;
}
.side-nav .nav-link {
	display: block;
	padding: 0.2rem 0.4rem;
}
.side-nav .nav-link:hover, .side-nav .nav-link:focus {
    text-decoration: none;
}
.side-nav .nav-link.active {

}

.side-nav .nav-link + .daughter {
	height: 0;
	overflow-y: hidden;
}
.side-nav .nav-link.active + .daughter {
	height: auto;
	overflow-y: inherit;
}
.mother > .nav-link {
	padding: 0.4rem 0.5rem;
}
.mother > .nav-link::after {
	display: inline-block;
    margin-left: 0.255em;
    content: " ";
    width: 1rem;
    height: 1rem;
    /* background: transparent  url(../img/arrow-dre-gry_24x16.svg) no-repeat right center;
    background-size: 12px 8px;
    transform: rotate(90deg); */
}
.mother > .nav-link.active {
	font-weight: 400;
}
.mother > .nav-link.active:after { background-image: none; }
.daughter > .nav-link {
	padding: 0.4rem 0.5rem 0.4rem 1.5rem;
}
.daughter > .nav-link.active {
	background: transparent url(../img/arrow-dre-blk_24x16.svg) no-repeat 0.5rem center;
	background-size: 12px 8px;
}

.side-nav-btn { 
	display: none;
	border: 1px solid #000000;
	color: #ffffff;
	background-color: #000000;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: 0;
}
.side-nav > .side-nav-btn:before { 
	content: "Open";
	padding-right: 0.5rem;
}
.side-nav.slip > .side-nav-btn:before { content: "Close"; }


/* 
@media (max-width: 991px) {
.side-nav { 
	position: fixed;
	top: 120px;
	z-index: 500;
	border: solid 1px #000000;
	border-right: none;
	right: 0px;
	transition-property: transform;
	transition-duration: 0.5s;
	transition-timing-function: ease-in-out;
	transform: translateX(300px);
	opacity: 0;
}
.side-nav.navfix { opacity: 1; }
.side-nav.slip {
	transform: translateX(0px);
}
.side-nav-btn { 
	display: block;
	position: absolute;
	left: 0px;
	transform: rotate(270deg) translate(-38px, -78px);
}
} */



/* Cookies table */

table.cookie-id th:nth-child(1), table.cookie-id th:nth-child(2) {
	width: 25%;
}
table.cookie-id th, table.cookie-id td {
	padding: 4px 4px 8px 8px;
	vertical-align: top;
}
table.cookie-id td {  font-size: 90%; }
table.cookie-id td:nth-child(1) {
    color: #c7254e;
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}
table.cookie-id tr:nth-child(even) {
	background-color: #f6f6f6;
}
/*  Style guideline specific */

#style blockquote {
	color: #858585;
	font-size: 125%;
}
#style blockquote > p {
	border-left: 2px solid #858585;
	padding: 1rem;
}






















/* ADDITIONAL STYLES FOR FOR BUY ON LINE WITH MODAL
==================================================================== */
	
	
#prices .main-content {
	padding-top: 0;
}
	
/* Edit pills to look like other buttons - Used in products */
.nav-pills.pill-btn .nav-link {
  border-radius: 24px;
}

.nav-pills.pill-btn .nav-item > .nav-link {
	color: var(--cyan);
	background-color: #ffffff;
	border: 2px solid var(--cyan);
	}

.nav-pills.pill-btn > .nav-item { margin-right: 10px; }
.nav-pills.pill-btn > .nav-item:last-child { margin-right: 0; }	
 .nav-pills.pill-btn .nav-link:hover { background-color: var(--orange); }
.nav-pills.pill-btn .nav-link.active,
.nav-pills.pill-btn .show > .nav-link {
  color: #fff;
  background-color: var(--cyan);
}



/* Edit Forms. */

label {
    display: inline-block; /* default */
    margin-bottom: 0.5rem; /* default */
    /* style like h4 */
	color: #858585;
	color: #000000;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
}
label.radio-wrap { font-size: 0.9rem; }

span.form-text {
	font-size: 0.8rem;
	color: #858585;
}



/* Edit Panes */
.tab-pane {
  border: none;
  /* padding: 20px; */
  padding 0;
  border-radius: 0;
}
/* 
  @media (min-width: 860px) {
.tab-pane {
  padding: 0;
}
}
*/


/*  CUSTOM RADIO BUTTON - Convert selection to checkboxes for negative and positive */

 /* Customize the label container */
.radio-wrap {
  display: block;
  position: relative;
  padding-left: 24px;
  margin-bottom : 0.3rem;
  cursor: pointer;
  	text-transform: capitalize;
	color: #000000;
	font-weight: 400;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 100;
}
.radio-wrap:last-child {
	margin-bottom: 1rem;
}

/* Hide the browser's default radio button */
.radio-wrap input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 24px;
  top: 0;
  left: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 3px;
  left: 0;
  height: 16px;
  width: 16px;
  background-color: #ffffff;
  border: 2px solid var(--cyan);
  z-index: -1;
  /* border-radius: 50%; */
}

/* On mouse-over, add a grey background color */
.radio-wrap:hover input ~ .checkmark {
    background-color: var(--orange);
}

/* When the radio button is checked, add a solid background */
.radio-wrap input:checked ~ .checkmark {
  background-color: var(--cyan);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-wrap input:checked ~ .checkmark:after {
  display: block;
}



/* PRODUCT PRICES SECTION
---------------------------------------------------------------------------- */
/* Product Title */
.product-title {
	padding-top: var(--navbar-height);
	position: relative;
}
h1.prices-h1 {
	margin-bottom: 1.5rem;
}
.product {
	position: relative;
}

@media (min-width: 992px) and (max-width: 1199px) {
.product { background-size: 970px auto; }
}
@media (min-width: 860px) and (max-width: 991px) {
.product { background-size: 846px auto; }
}


/* --breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
*/





.package {
	border-top: 2px solid #000000;
	padding-top: 1rem;
}
.package .row {
	margin-top: 0;
}
.package-select h4 {
	font-size: 1rem;
	color: #777777;
	text-transform: uppercase;
	margin: 8px 0 4px 0;
}

h3.package-heading {
	font-size: 36px;
}

ul.package-description {
	list-style: square inside;
	margin-bottom: 0;  
	padding-left: 0;
	font-weight: 700;
	font-size: 1.5rem;
	color: inherit;
	letter-spacing: 0.05em;
}
ul.package-description li {
	padding: 0.1rem 0;
	line-height: 1;
}




/* PRODUCT FORM - CUSTOM CONTROLS */

/* Master colours */
/* 
.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #05bf15;
  background-color: #05bf15;
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: none;
}
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: #858585;
}
.custom-control-input:active ~ .custom-control-label::before {
    background-color: #858585;
  border-color: #858585;;
}
.custom-control-label::before {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: #858585;
  border: #858585 solid 1px;
}
.custom-control-label::after {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background: no-repeat 50% / 50% 50%;
}
.custom-switch .custom-control-label::after {
  top: calc(0.25rem + 2px);
  left: calc(-2.25rem + 2px);
  width: calc(1rem - 4px);
  height: calc(1rem - 4px);
  background-color: #ffffff;
  border-radius: 0.5rem;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
}
.custom-switch {
	position: relative;
}
.custom-switch:before {
	content: " ";
	color: #858585;
	font-size: 0.75rem;
	position: absolute;
	right: 2.5rem;
	top: 0.3rem;
}
.custom-switch:before { content: "vat";}

.select-select { margin-bottom: 1rem; }

.custom-select {
    display: inline-block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 1.75rem 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #000000;
    vertical-align: middle;
    background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23000000' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
    border: 1px solid #000000;
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
*/

/* VAT SWITCH */
.form-check-input:checked {
  background-color: var(--cyan);
  border-color: var(--cyan);
}

.form-switch {
  padding-left: 0px;
  min-height: .5em;
  margin-bottom: 0px;
}
.form-check .form-check-input {
	float: none;
	margin-left: 0.5em;
}
label.form-check-label {
  text-transform: uppercase;
  color: #858585;
  font-size: 0.9rem;
  margin-bottom: 0px;
}
.form-check-input:focus  {
	box-shadow: none;	
}





/* PRICES TABLE */


.package-includes p { margin-bottom: 0;}

ul.includes-list {
	list-style: square inside;
	margin-bottom: 0;
	padding: 0.5rem 1rem;
	border: 2px solid var(--cyan);
	}
ul.includes-list li {
	/* border-bottom: solid 2px #858585; */
	padding: 0.1rem 0;	
}
ul.includes-list li::marker {color: var(--cyan);}
ul.includes-list li:last-child {
	/* border-bottom: none; */
}
.package-includes div {
	border: solid var(--cyan) 2px;
	padding: 15px;
}

.prices-table {
	font-weight: 400;
	font-size: 1rem;
	text-align: right;
}
.prices-table th {
	padding: 0.3rem 0 0.3rem 0;
	border-bottom: solid 2px #ffffff;
	border-top: none;
}
.prices-table td {
	padding: 0.3rem 0 0.2rem 0;
	border-bottom: solid 2px #858585;
	border-top: none;
	vertical-align: bottom;
}
.prices-table th:first-child, .prices-table td:first-child {
	text-align: left;
	position: relative;
}
.prices-table th.inc, .prices-table th.ex {
	text-align: center;
	}
.prices-table th.vat {
	text-align: right;
	}
/* Add the  @ sign */
.prices-table td.quantity:after {
	content: "@";
	color: #858585;
	position: absolute;
	right: 4px;
}

.prices-table th {
	text-transform: uppercase;
	color: #858585;
	font-size: 0.9rem;
}
.prices-table td.pounds:before {
	content: "£";
}
.prices-table td.pence:before {
	content: "£";
}

.prices-table td.pence {
	/* display: none; */
}
.prices-table thead th {
    border-bottom: 2px solid #ffffff;
}
/* Rewrite for BUY button */
.btn-buy, .btn-call, .btn-email {
    /* padding: 0.25rem 0.5rem; */
    font-size: 1rem;
    line-height: 1;
    border-radius: 0;
    color: #000000;
    background-color: #ffffff;
    text-transform: uppercase;
    border: 1px solid #000000;
}
.btn-buy:hover, .btn-buy:focus, .btn-buy:active {
	color: #ffffff;
    background-color: #000000;
    border: 1px solid #000000;
}
.btn-email:hover, .btn-email:focus, .btn-email:active {
	color: #ffffff;
    background-color: #000000;
    border: 1px solid #000000;
}
.btn-call:hover, .btn-call:focus, .btn-call:active {
	color: #ffffff;
    background-color: #000000;
    border: 1px solid #000000;
}

.prices-table, .choose-form label, ul.includes-list {
	font-size: 1rem;
}

/* reduce price size to fit table */
@media (min-width: 900px) and (max-width: 1667px) {

.prices-table .btn {
padding: 0.3rem 0.6rem;
font-size: 1rem;
line-height: 1.2;
}
}
@media (min-width: 768px) and (max-width: 899px) {
	.prices-table, .prices-table th  {
	font-size: 0.8rem;
}
.prices-table .btn {
padding: 0.2rem 0.4rem;
font-size: 0.8rem;
line-height: 1.2;
}
}
@media (max-width: 399px) {
	.prices-table, .prices-table th  {
	font-size: 0.8rem;
}
.prices-table .btn {
padding: 0.2rem 0.4rem;
font-size: 0.8rem;
line-height: 1.2;
}
}
/* PACKSHOTS AND VIDEO */

.packshot-wrap {
	width: 100%;
	padding: 0;
}
.package-packshot {
	margin-bottom: 1rem;
}
/* this markup is the same as img-wrap-square used on the work gallery */
.package-packshot {
	display: block;
	position: relative;
	width: 100%;
	padding-bottom: 100%;
	overflow: hidden;

}
.package-packshot > img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	cursor: pointer;
}
.package-packshot.plus:after {
	content: "";
	position: absolute;
	left: 0.75rem;
	bottom: 0.75rem;
	z-index: 10;
	display: block;
	width: 24px;
	height: 24px;
	background: transparent url(../img/video-zoom-key_64x64.svg) no-repeat -24px 0;
	background-size: 48px 48px;
	cursor: pointer;
}


.video-btn {
	width: 100%;
}	

/* Additions to Modal Gallery */ 

@media (orientation: landscape) {

.pak-wrap { 
	display: block;
    position: relative;
    width: 100%; 
    height: 90vh; 
    text-align: center; 
}
.pak-wrap img {height: 100%; width: auto; }

.vid-wrap { 
	display: block;
    position: relative;
    width: 100%; 
    height: 90vh; 
    text-align: center; 
}	
.vid-wrap > video {
	width: 100%;
	height: auto;
}
.modal-dialog { max-height: 90vh; max-width: 90vw; } 
} /* /@media */


@media (orientation: portrait) {
.modal-content > video {
	width: 90vw;
	height: 90vw;
	max-width: 90vw;
}
.modal-dialog.modal-video { max-width: 90vw; max-height: 90vw; }

} /* /@media */

.modal-content { width: auto; }

@media (orientation: landscape) {

.modal-content > video {
	height: 90vh;
	width: 90vh;
	max-height: 90vh;
}
.modal-dialog { max-height: 90vh; max-width: 90vw; } 
} /* /@media */


@media (orientation: portrait) {
.modal-content > video {
	width: 90vw;
	height: 90vw;
	max-width: 90vw;
}
.modal-dialog.modal-video { max-width: 90vw; max-height: 90vw; }
} /* /@media */

.modal-dialog-video {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  /* max-width: 90vh; */
  margin-top: 5vh;
  margin-right: auto;
  margin-bottom: 5vh;
  margin-left: auto;
  text-align: center;
 }

.modal-dialog-video::before {
  display: block;
  height: 100vh;
  content: "";
}
.close-video {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: 100px;
	height: 100px;
	padding: 25px;
}




/* SCALE AND ORIENTATION FOR B.O.L. */	


@media (max-width: 575px) {
	
.custom-select {
    width: calc(100% - 120px) ;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.25rem 1.75rem 0.25rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 0.5rem;
}
	
} /* /@media */

@media (min-width: 768px) {
h3.package-heading {
	position: absolute;
	top: -68px; /* Font-size plus 2 rem */
	left: 0;
}
} /* /@media */


@media (max-width: 767px) {
/* Inline list for small screens - Uses B4 inline list styles */
ul.includes-list { /* padding-left: 0;*/ list-style: none;}
ul.includes-list li { display: inline-block; }
ul.includes-list li:after { content: ",";}
ul.includes-list li:not(:last-child) { margin-right: 0.5rem; }
h3.package-heading { margin-top: 1rem;} 
.package-includes {margin-bottom: 1rem; }
/* Remove from flow and place at bottom of window */
.package-select > .cta { 
	position: fixed;
	display:none;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	padding: 0 20px;
	z-index: 2000;
	opacity: 0;
}
.package-select > .cta.on {
	opacity: 1;
}
.cta.on p:first-of-type { margin-top: 1rem;}
} /* /@media */

/* Additional styles for space saving */
.h4-before {
	display: inline-block;
	width: 110px;
}

/* Classes for VAT toggle */
.prices-table.inc-vat th.ex, .prices-table.inc-vat td.ex {display: none; }
.prices-table.ex-vat th.inc, .prices-table.ex-vat td.inc {display: none; }

@media (max-width: 991px)  {
h3.package-heading { font-size: 30px; }
ul.package-description { font-size: 1.2rem; }
.package-select > .radio-button-select { display: none; }
/* Classes for VAT toggle */
/*
.prices-table.inc-vat th.ex, .prices-table.inc-vat td.ex {display: none; }
.prices-table.ex-vat th.inc, .prices-table.ex-vat td.inc {display: none; }
*/
/* .prices-table.ex-vat th.ex, .prices-table.ex-vat td.ex {display: inline; }
.prices-table.inc-vat th.inc, .prices-table.inc-vat td.inc {display: inline; } */ 

} /* /@media */ 
@media (min-width: 992px)  {
	.packshot-wrap {
	width: 100%;
	padding: 0px 2rem;
}
.package-select > .select-select { display: none; }

} /* /@media */ 


@media (min-width: 1200px)  {
.packaging-heading {
	top: -66px;
	font-size: 50px;
}
 
} /* /@media */

/* Scale Forms and table text at regular break points */

@media (min-width: 1440px) {
.prices-table, .package-select label { font-size: 1.1rem; }
.check-box-select label { margin-bottom : 0.5rem; }
} /* /@media */
@media (min-width: 1680px) {
.prices-table, .package-select label { font-size: 1.2rem; }
.check-box-select label { margin-bottom : 0.6rem; }
} /* /@media */







/* DISABLE HIDE REMOVE PRICES MODAL !!!!!!
	========================================================= */

/* 
#prices .modal {
	display: none !important;
}


#prices .modal-backdrop.show {
  opacity: 0;
  display: 0;
  visibility: hidden;
}
*/

#prices .package-packshot.plus:after {
	  opacity: 0;
  display: 0;
  visibility: hidden;
 }

.package-packshot {
	cursor: pointer !important;
}



/* VINYL PITCH 
------------------------------------------------------- */

.vinyl-pitch { 
	z-index: 1029;
	display: block;
	width: 100%;
	background-color: var(--cyan);
	position: fixed;
	padding-top: 1rem;
	padding-bottom: 1rem;
	bottom: 0;
	left: 0;
	right: 0;
	opacity: 0;
	animation-duration: 1.5s;
	animation-delay: 0.5s;
  animation-name: pitch-up;
  animation-fill-mode: forwards ;
  animation-timing-function: ease-out;
}
@keyframes pitch-up {
  from {
    translate:  0 10vh;
opacity: 1;
  }
  to {
    translate: 0 0;
    opacity: 1;
  }
}

.vinyl-pitch.pitch-fade {
	opacity: 1;
  animation-name: pitch-fade;
  animation-duration: 0.5s;
  animation-fill-mode: forwards ;
  animation-timing-function: ease-out;
}
@keyframes pitch-fade {
  from {
opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.vinyl-pitch.pitch-hide { display:none; }


p.pitch-text {
	text-align: center;
	color: #fff;
	font-size: 16px;
	line-height: 1.2;
	font-weight: 700;
	padding-left: 15vw;
	padding-right: 15vw;
}

.pitch-close {
	display: block;
	position: absolute;
	cursor: pointer;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	color: var(--cyan);
	background-color: #fff;
	text-indent: -9999px;
     background: #fff url(../img/cross-breed.svg) no-repeat center center;
    background-size: 48px 48px;
	top: 1rem;
	right: 1rem;
}

@media (min-width: 768px) {
	p.pitch-text { font-size: 2.4vw; }
}
@media (max-width: 575px) {
	p.pitch-text { text-align: left; padding-left: 0.75rem; }
}










/* FOOTER 
------------------------------------------------------- */
/*  .footer-bar {
	border-top: solid 2px #fff;
	height: 20px;
} */

.social {  }
.mailing { 
	justify-content: flex-end;
	display: flex;
	align-items: center;
}

.blog-btn {margin-right: var(--pad-unit); }
 
/* SOCIAL NETWORK MENU -------------------- */
ul.soc-net  {
	list-style: none;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	padding-left: 0;
	margin-top: 24px;
}
ul.soc-net li { margin-right: 2rem; text-align: left; }
ul.soc-net li a {
  background: #000000 url(../img/social-icons-wht_48x480.svg) no-repeat 0 0;
  background-position-x: 0px;
  background-position-y: 0px;
  background-size: auto;
  background-size: 480px 48px;
  text-indent: -9999px;
  width: 48px;
  line-height: 48px;
  display: inline-block;
  padding: 0;
  height: 48px;
  overflow: hidden;
  text-decoration: none;
  border: none;
  border-radius: 24px;
}


ul.soc-net li.instagram a { background-position: 0px 0px; }
ul.soc-net li.linkedin a { background-position: -48px 0px; }
ul.soc-net li.pinterest a { background-position: -96px 0px; }
ul.soc-net li.twitter a { background-position: -144px 0px; }
ul.soc-net li.youtube a { background-position: -192px 0px; }
ul.soc-net li.facebook a { background-position: -242px 0px; }

ul.soc-net li.instagram a:hover { background-color: #d6249f; }
ul.soc-net li.linkedin a:hover { background-color: #0A66C2; }
ul.soc-net li.pinterest a:hover { background-color: #E60023; }
ul.soc-net li.twitter a:hover { background-color: #1DA1F2; }
ul.soc-net li.youtube a:hover { background-color: #FF0033; }
ul.soc-net li.facebook a:hover { background-color: #1877F2; }

ul.soc-net li.instagram a:hover {
  background: #d6249f;
  background: url(../img/social-icons-wht_48x480.svg), radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
  background-position: 0px 0px, 0 0;
  background-repeat: no-repeat, no-repeat;
  background-size: 480px 48px, 100% 100%;
}

ul.soc-net li.tiktok a {
  background: #000 url(../img/tiktok-icon_512x1024.svg) no-repeat left top;
  background-size: 48px 96px;
}
ul.soc-net li.tiktok a:hover {
	background-position: left bottom;
}

a.key-link, a.tt-link, a.rsd-link {
	display: inline-block;
	width: 180px;
	height: 64px;
	text-indent: -9999px;
	overflow: hidden;
	margin: 0 2rem 0 0;
	background: transparent url(../img/key-breed-tt-modo_1024x64.svg) no-repeat left center;
	background-size: 1024px 64px;
 }


a.key-link { background-position: 0px 0 ; width: 160px; }
a.modo-link { background-position: -768px 0; }
a.tt-link { background-position: -512px 0; width: 200px; }

a.rsd-link { 
		background-image: url(../img/rsdUn-link.svg);
		background-position: left center ;
		background-size: 224px 56px;
}

@media screen and (max-width: 1199px ){
ul.soc-net {
  justify-content: flex-start;
}  
ul.soc-net li {
  margin-right: 2rem;
  margin-left: 0;
}


}
/* ACCREDITATION  */
.accred { 
	border-top: solid 2px #000;
	border-bottom: solid 2px #000;
	}
a.eoa {
	display: inline-block;
	text-align: left;
	width: 182px;
	height: 128px;
	background: transparent url(../img/eoa-logo-blk_510x216.svg) no-repeat left center;
	background-size: auto 76px;
	text-indent: -9999px;
	margin: 0 35px;
}
a.bcorp { 
	display: inline-block;
	text-align: left;
	width: 86px;
	height: 128px;
	background: transparent url(../img/b-corp-logo-blk-128x216.svg) no-repeat center center;
	background-size: auto 108px;
	text-indent: -9999px;
	
}

a.gbc { 
	display: inline-block;
	text-align: left;
	width: 92px;
	height: 128px;
	background: transparent url(../img/gbc-accredited-blk_256x256.svg) no-repeat right center;
	background-size: 90px 90px;
	text-indent: -9999px;
 }

@media (max-width: 575px) {
a.eoa, a.bcorp, a.gbc {
	height: 128px;
	background-position:  center center;
	margin: 0;
}
a.eoa, a.bcorp, a.gbc { width: calc(100% - var(--bs-gutter-x)); }
/* a.bcorp, a.gbc { width: calc((100% - var(--bs-gutter-x)) * .5); } */
.mailing { 
	justify-content: center;
	padding-bottom: 24px;
}
ul.soc-net  {
	justify-content: center;
}	
}
@media (min-width: 576px) and (max-width: 991px) { 
.accred { display: flex;
		justify-content: space-between;
	}
}	
@media (min-width: 1200px) {
.accred {
	text-align: right !important;
    -ms-flex-order: 6;
    order: 6;
    border: none;
  }
  a.eoa { margin: 0 50px; }
}



/* MODAL MAILCHIMP 
Mailchimp Form styles at top */


.modal-dialog {
	justify-content: center;
}
.modal-content {
 min-width: 420px;	
}

/* Hide bot sniffer */
.optional {
	display :none;
}
