/*** VARIABLES ***/
/* Colours */
/*** BASE ***/
* {
  text-rendering: optimizeLegibility;
}
* ::selection {
  color: #ffffff;
  background-color: #b8860b;
}

html {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  color: #262626;
  scroll-behavior: smooth;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4 {
  font-family: 'Playfair Display', serif;
  color: #0d0d0d;
  margin-top: 0;
  margin-bottom: 15px;
}

p {
  font-weight: 300;
  line-height: 1.6;
  margin-bottom: 10px;
}
p:last-of-type {
  margin-bottom: 15px;
}

hr {
  width: 100%;
  height: 1px;
  background-color: #262626;
  margin: 15px auto 15px 0;
  padding: 0;
  border: 0;
}
hr.hr-center {
  margin-left: auto;
}
hr.hr-right {
  margin-right: 0;
  margin-left: auto;
}
hr.hr-10 {
  width: 10%;
}
hr.hr-20 {
  width: 20%;
}
hr.hr-30 {
  width: 30%;
}
hr.hr-40 {
  width: 40%;
}
hr.hr-50 {
  width: 50%;
}
hr.hr-60 {
  width: 60%;
}
hr.hr-70 {
  width: 70%;
}
hr.hr-80 {
  width: 80%;
}
hr.hr-90 {
  width: 90%;
}
hr.hr-100 {
  width: 100%;
}

/*** SITE ***/
/* Fix Bootstrap icons */
[class^="bi-"]::before,
[class*=" bi-"]::before {
  vertical-align: middle;
}

.link, #section-preheader ul li a, #section-header .header-navigation ul li a, #section-footer ul li a {
  color: inherit;
  text-decoration: none;
  transition: color .5s;
}
.link:active, #section-preheader ul li a:active, #section-header .header-navigation ul li a:active, #section-footer ul li a:active, .link:focus, #section-preheader ul li a:focus, #section-header .header-navigation ul li a:focus, #section-footer ul li a:focus, .link:hover, #section-preheader ul li a:hover, #section-header .header-navigation ul li a:hover, #section-footer ul li a:hover {
  color: #b8860b;
}

.search-focused {
  color: #b8860b;
}

.btn {
  font-family: 'Poppins', sans-serif;
  letter-spacing: .2rem;
  text-transform: uppercase;
  padding: 1rem 1.75rem;
  border-radius: 0;
  line-height: 1;
}
.btn i {
  margin-left: 1rem;
}
.btn.btn-primary {
  color: #ffffff;
  background-color: transparent;
  border-color: #ffffff;
}
.btn.btn-primary:active, .btn.btn-primary:focus, .btn.btn-primary:hover {
  color: #000000;
  background-color: #ffffff;
}
.btn.btn-secondary {
  color: #0d0d0d;
  background-color: transparent;
  border-color: #0d0d0d;
}
.btn.btn-secondary:active, .btn.btn-secondary:focus, .btn.btn-secondary:hover {
  color: #ffffff;
  background-color: #0d0d0d;
}

#section-preheader {
  background-color: #ffffff;
  border-bottom: 1px solid #d9d9d9;
  padding-top: 15px;
}
#section-preheader ul {
  display: flex;
  margin-bottom: 0;
}
#section-preheader ul li {
  margin-bottom: 15px;
}
#section-preheader ul li a {
  white-space: nowrap;
}
#section-preheader ul li i {
  font-size: 1.1rem;
  margin-right: 5px;
}
#section-preheader ul li .input-group .input-group-text {
  color: inherit;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  padding: 0 10px 0 0;
  transition: color .5s;
}
#section-preheader ul li .input-group .form-control {
  position: relative;
  padding: 0;
  border-width: 0 0 1px 0;
  border-color: #bfbfbf;
  border-radius: 0;
  color: #262626;
  transition: border-color .5s;
}
#section-preheader ul li .input-group .form-control::placeholder {
  color: #bfbfbf;
}
#section-preheader ul li .input-group .form-control:focus {
  box-shadow: none;
  border-color: #b8860b;
}
#section-preheader ul li .input-group .form-control:hover {
  border-color: #b8860b;
}
#section-preheader ul li .input-group:focus-within .input-group-text {
  color: #b8860b;
}
#section-preheader ul li:first-child {
  width: 100%;
  margin-right: 1rem;
}
@media (min-width: 992px) {
  #section-preheader ul li:first-child {
    width: 260px;
    margin-right: auto;
  }
}
#section-preheader ul li:not(:first-child):not(:last-child) {
  margin-right: 15px;
}

#section-header {
  padding-top: 15px;
  background-color: #ffffff;
}
#section-header .header-navigation {
  position: static;
  text-align: center;
}
#section-header .header-navigation ul {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}
#section-header .header-navigation ul li {
  margin-bottom: 15px;
  letter-spacing: .2rem;
  text-transform: uppercase;
}
@media (max-width: 991.98px) {
  #section-header .header-navigation ul li {
    padding-top: 0;
  }
}
#section-header .header-navigation ul li a svg {
  width: 160px;
  height: auto;
  fill: #b8860b;
  transition: fill .5s;
}
#section-header .header-navigation ul li a svg:active, #section-header .header-navigation ul li a svg:focus, #section-header .header-navigation ul li a svg:hover {
  fill: #262626;
}
#section-header .header-navigation ul li a.list-item-sale {
  color: #e50000;
}
#section-header .header-navigation ul li a.list-item-sale:active, #section-header .header-navigation ul li a.list-item-sale:focus, #section-header .header-navigation ul li a.list-item-sale:hover {
  color: #b8860b;
}
#section-header .header-navigation ul li:not(:last-child) {
  margin-right: 15px;
}
#section-header .header-navigation ul li.header-logo {
  padding-top: 0;
}
#section-header .header-navigation ul li.header-logo a {
  display: inline-block;
}
@media (max-width: 991.98px) {
  #section-header .header-navigation ul li.header-logo {
    margin-right: 0;
    order: -1;
    width: 100%;
  }
}
#section-header .dropdown-megamenu {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 1000;
  padding-top: 15px;
  padding-bottom: 0;
  background-color: #ffffff;
  border-bottom: 1px solid #d9d9d9;
}

.visability {
  visibility: visible !important;
  opacity: 1 !important;
}

#section-warning {
  background-color: #e50000;
  padding: 15px 0;
}
#section-warning p {
  color: #ffffff;
  text-align: center;
  letter-spacing: .2rem;
  text-transform: uppercase;
}
#section-warning p:last-child {
  margin-bottom: 0;
}

.sps--blw {
  position: sticky;
  top: 0;
  z-index: 2;
}
.sps--blw #section-header {
  border-bottom: 1px solid #d9d9d9;
}

#section-message {
  background-color: #0d0d0d;
  padding: 15px 0;
}
#section-message p {
  color: #ffffff;
  text-align: center;
}
#section-message p strong {
  font-weight: 700;
  text-transform: uppercase;
}
#section-message p:last-child {
  margin-bottom: 0;
}

#section-hero {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-hero.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 60px;
}
#section-hero .hero-content {
  padding: 12vw 5vw;
  background-color: rgba(13, 13, 13, 0.5);
}
#section-hero .hero-content h1 {
  color: #ffffff;
  font-size: 3rem;
  margin-bottom: 15px;
}
#section-hero .hero-content p.lead {
  color: #ffffff;
  font-size: 1.6rem;
  font-weight: 200;
  margin-bottom: 25px;
}

#section-introduction {
  text-align: center;
  margin-bottom: 60px;
}
#section-introduction p.lead {
  font-size: 1.4rem;
}

.section-split {
  margin-bottom: 60px;
}
.section-split .container-fluid {
  padding: 0;
}

#section-categories {
  margin-bottom: 60px;
  background-color: #f2f2f2;
  position: relative;
  z-index: 1;
  padding: 60px 0;
}
#section-categories .ratio {
  position: relative;
  background-image: linear-gradient(to bottom, rgba(13, 13, 13, 0) 50%, rgba(13, 13, 13, 0.75) 100%);
  overflow: hidden;
}
#section-categories .ratio.ratio-custom {
  --aspect-ratio: 150%;
}
#section-categories .ratio .ratio-container {
  align-items: flex-end;
  top: 30px;
  left: 30px;
  width: calc(100% - 60px);
  height: calc(100% - 60px);
}
#section-categories .ratio:active:after, #section-categories .ratio:focus:after, #section-categories .ratio:hover:after {
  transform: scale(1.1);
}
#section-categories .ratio:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  transition: transform .5s ease;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#section-featured {
  margin-bottom: 30px;
  text-align: center;
}
#section-featured .featured-product {
  margin-bottom: 40px;
  /* An extra 10px to compensate for swiper-pagination */
}
#section-featured .featured-product .product-container {
  text-decoration: none;
  color: inherit;
}
#section-featured .featured-product .product-container .ratio {
  background-color: #f2f2f2;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#section-featured .featured-product .product-container .product-name {
  display: block;
  margin-top: 15px;
  color: #262626;
  font-weight: 300;
  transition: color .2s;
  text-decoration: none;
}
#section-featured .featured-product .product-container .product-rating i {
  transition-property: color;
  transition-duration: .5s;
  transition-timing-function: ease-in-out;
  margin-right: .2rem;
}
#section-featured .featured-product .product-container .product-rating i:nth-child(2) {
  transition-delay: .1s;
}
#section-featured .featured-product .product-container .product-rating i:nth-child(3) {
  transition-delay: .2s;
}
#section-featured .featured-product .product-container .product-rating i:nth-child(4) {
  transition-delay: .3s;
}
#section-featured .featured-product .product-container .product-rating i:nth-child(5) {
  transition-delay: .4s;
}
#section-featured .featured-product .product-container .product-rating .rating-empty {
  color: #d9d9d9;
}
#section-featured .featured-product .product-container:active .product-rating i.bi-star-fill:not(.rating-empty), #section-featured .featured-product .product-container:focus .product-rating i.bi-star-fill:not(.rating-empty), #section-featured .featured-product .product-container:hover .product-rating i.bi-star-fill:not(.rating-empty) {
  color: #b8860b;
}
#section-featured .featured-product .product-container:active .product-name, #section-featured .featured-product .product-container:focus .product-name, #section-featured .featured-product .product-container:hover .product-name {
  color: #b8860b;
}

.tile {
  text-align: center;
  padding: 10vw 5vw;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.tile .tile-small {
  text-transform: uppercase;
  letter-spacing: .2rem;
  margin-bottom: 0;
}
.tile .tile-large {
  font-size: 2.6rem;
  margin-bottom: 15px;
}
.tile .tile-copy {
  font-size: 1.2rem;
  margin: 0 10% 15px;
}

a.tile,
a.ratio {
  color: inherit;
  text-decoration: none;
}
a.tile:active .btn-primary, a.tile:focus .btn-primary, a.tile:hover .btn-primary,
a.ratio:active .btn-primary,
a.ratio:focus .btn-primary,
a.ratio:hover .btn-primary {
  color: #000000;
  background-color: #ffffff;
}
a.tile:active .btn-secondary, a.tile:focus .btn-secondary, a.tile:hover .btn-secondary,
a.ratio:active .btn-secondary,
a.ratio:focus .btn-secondary,
a.ratio:hover .btn-secondary {
  color: #ffffff;
  background-color: #0d0d0d;
}

.title {
  text-align: center;
  margin-bottom: 30px;
}

#tile-watches {
  background-image: linear-gradient(rgba(13, 13, 13, 0), rgba(13, 13, 13, 0.8)), url(https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-split-watches.jpg);
  background-size: auto 200%, cover;
  background-repeat: no-repeat;
  background-position: 0 0, center;
  transition: background-position 0.5s;
}
#tile-watches h3,
#tile-watches p {
  color: #ffffff;
}
#tile-watches:active, #tile-watches:focus, #tile-watches:hover {
  background-position: 0 100%, center;
}

#tile-partnership {
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8)), url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-split-partnership.jpg");
  background-size: auto 200%, cover;
  background-repeat: no-repeat;
  background-position: 0 0, center;
  transition: background-position 0.5s;
}
#tile-partnership h3,
#tile-partnership p {
  color: #262626;
}
#tile-partnership:active, #tile-partnership:focus, #tile-partnership:hover {
  background-position: 0 100%, center;
}

#category-1:after {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-cat-1.jpg");
}

#category-2:after {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-cat-2.jpg");
}

#category-3:after {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-cat-3.jpg");
}

#category-4:after {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-cat-4.jpg");
}

#product-1 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-1.png");
}

#product-2 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-2.png");
}

#product-3 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-3.png");
}

#product-4 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-4.png");
}

#product-5 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-5.png");
}

#product-6 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-6.png");
}

#product-7 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-7.png");
}

#product-8 {
  background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-prod-8.png");
}

.ratio {
  display: block;
  position: relative;
  width: 100%;
  margin-bottom: 30px;
}
.ratio .ratio-container {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.ratio.ratio-1x1 {
  --aspect-ratio: 100%;
}
.ratio.ratio-1x2 {
  --aspect-ratio: 200%;
}
.ratio:before {
  display: block;
  padding-top: var(--aspect-ratio);
  content: "";
}

#section-advert .tile {
  display: block;
  width: 100%;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%), url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-advert.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  text-align: right;
}
#section-advert .tile .tile-copy {
  margin: 0 0 15px 10%;
}
@media (min-width: 768px) {
  #section-advert .tile {
    background-image: url("https://aaronflynn.co.uk/portfolio/riverbrooks/img/riverbrooks-advert.jpg");
  }
}

#section-footer {
  background-color: #0d0d0d;
  color: #ffffff;
  padding-top: 60px;
  padding-bottom: 60px;
}
#section-footer h4 {
  color: #b8860b;
}
#section-footer ul {
  margin-bottom: 30px;
}
#section-footer ul li a i {
  font-size: 1.5rem;
}
#section-footer ul li:not(:last-child) {
  margin-bottom: 10px;
}
#section-footer ul.list-inline {
  margin-bottom: 0;
}
#section-footer ul.list-inline li:not(:last-child) {
  margin-right: 15px;
}
#section-footer ul.footer-subfooter {
  color: #8c8c8c;
  text-align: center;
}
#section-footer .footer-social {
  margin-bottom: 30px;
}
#section-footer .footer-social a img {
  transition: opacity .5s;
}
#section-footer .footer-social a:active img, #section-footer .footer-social a:focus img, #section-footer .footer-social a:hover img {
  opacity: .5;
}
#section-footer .footer-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  margin-bottom: 30px;
}
#section-footer .footer-logo hr {
  background-color: #595959;
}
#section-footer .footer-logo svg {
  fill: #ffffff;
  width: 160px;
  height: auto;
  transition: fill .5s;
  margin: 0 30px;
}
#section-footer .footer-logo svg:active, #section-footer .footer-logo svg:focus, #section-footer .footer-logo svg:hover {
  fill: #b8860b;
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-horizontal > .swiper-pagination-bullets {
  bottom: 0;
}

.swiper-pagination-bullet {
  opacity: 1;
  background-color: #d9d9d9;
}

.swiper-pagination-bullet-active {
  background-color: #b8860b;
}

.color-1 {
  color: #b8860b !important;
}

.background-color-1 {
  background-color: #b8860b !important;
}

.color-white {
  color: #ffffff !important;
}

.background-color-white {
  background-color: #ffffff !important;
}

.color-black-lightest {
  color: #595959 !important;
}

.background-color-black-lightest {
  background-color: #595959 !important;
}

.color-black-light {
  color: #404040 !important;
}

.background-color-black-light {
  background-color: #404040 !important;
}

.color-black {
  color: #000000 !important;
}

.background-color-black {
  background-color: #000000 !important;
}

.color-black-dark {
  color: #262626 !important;
}

.background-color-black-dark {
  background-color: #262626 !important;
}

.color-black-darkest {
  color: #0d0d0d !important;
}

.background-color-black-darkest {
  background-color: #0d0d0d !important;
}

.color-gray-lightest {
  color: #f2f2f2 !important;
}

.background-color-gray-lightest {
  background-color: #f2f2f2 !important;
}

.color-gray-light {
  color: #d9d9d9 !important;
}

.background-color-gray-light {
  background-color: #d9d9d9 !important;
}

.color-gray {
  color: #bfbfbf !important;
}

.background-color-gray {
  background-color: #bfbfbf !important;
}

.color-gray-dark {
  color: #a6a6a6 !important;
}

.background-color-gray-dark {
  background-color: #a6a6a6 !important;
}

.color-gray-darkest {
  color: #a6a6a6 !important;
}

.background-color-gray-darkest {
  background-color: #a6a6a6 !important;
}

/*# sourceMappingURL=stylesheet.css.map */