/* 20210821052404 - v2 */
.gui,
.gui-block-linklist li a {
  color: #000000;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #666666;
}

.gui a {
  color: #7e7e7e;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #7e7e7e;
  box-shadow: 0 0 2px #7e7e7e;
}

.gui-select.gui-focus .gui-handle {
  border-color: #7e7e7e;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #ffffff;
}

.gui-block-title {
  color: #000000;
  background-color: #ffffff;
}

.gui-content-title {
  color: #000000;
}

.gui-form .gui-field .gui-description span {
  color: #000000;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ffffff;
  background-color: #ffffff;
}

.gui-block-option-block {
  border-color: #ffffff;
}

.gui-block-title strong {
  color: #000000;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #ffffff;
}

.gui ul.gui-products li {
  border-color: #ffffff;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #ffffff;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #ffffff;
}

.gui-block-content .gui-table {
  border-color: #ffffff;
}

.gui-table thead tr th {
  border-color: #ffffff;
  background-color: #ffffff;
}

.gui-table tbody tr td {
  border-color: #ffffff;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #ffdb00;
  color: #000000;
  background-color: #ffdb00;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #ffdb00;
  color: #000000;
  background-color: #ffdb00;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #ccaf00;
  border-color: #ccaf00;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #ccaf00;
  border-color: #ccaf00;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #ffdb00;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #ffdb00;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #7e7e7e;
}

/* custom */
/* Lightspeed eCom Support Mathieu Brousseau-Julien Sept. 26th 2018 Start - Hide headline area - ticket # 633287 */
@font-face {
    font-family: 'Century Gothic';
    font-style: normal;
    font-weight: 700;
    src: url('https://fonts.cdnfonts.com/s/18111/GOTHICB.woff') format('woff');
}

#headlines {
  display: none !important;
  visibility: hidden !important;
}

.text-component h4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.main-header__logo {
 margin-top: 1rem;
 margin-bottom: 1rem;
}

.imgresp {
  width: 100%;
  height: auto;
}

.page_bottom {
  margin: 1rem auto;
  padding: 1rem 0;
}

.page_bottom img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.margin-bottom-md text-center {
  text-align: center;
  margin-bottom: 20px;
}

a, .link {
  color: #7E7E7E;
  text-decoration: underline;
}

[aria-current] {
  color: #FFDB00;
}
.main-footer__link:hover {
  color: #FFDB00;
  text-decoration: none; !important
  transition: color .2s;
}

/* nav bar link customization */

.main-header__dropdown {
  background-color: #FFDB00;
}

.main-header__link:hover, .main-header__link[aria-current="page"] {
  text-decoration: none;
  color: #FFDB00;
}

.main-header__dropdown-link:hover, .main-header__dropdown-link[aria-current="page"] {
  text-decoration: none;
  color: #7E7E7E;
}

.main-header--desktop .main-header__arrow-icon {
  display: none !important;
  visibility: hidden !important;
}

.main-header__dropdown-link .icon {
  flex-shrink: 0;
  visibility: hidden;
}

/* category title home page */

.category-card__title {
  visibility: hidden;
  display: none;
}


/* Lightspeed eCom Support Mathieu Brousseau-Julien Sept. 26th 2018 End */
.categories .category span {
  display: none !important;
  visibility: hidden !important;
}
/* Lightspeed eCom Support Mathieu Brousseau-Julien Sept 26th 2018 Start - Custom CSS for the Staff Picks grid - ticket # 633287 */
.row.staff-picks div {
  text-align: center !important;
}
/* Lightspeed eCom Support Mathieu Brousseau-Julien Sept 26th 2018 End */

tr.articlenumber{
	display: none !important;  
}

/* Text Styling - Filippo Feb 2021 */

.page-title{
  background: #000;
  color: #FFDB00;
  padding: 24px;
  text-transform: uppercase;
  font-family: 'Century Gothic', sans-serif;
  font-weight: 700;
  font-size: 52px;
  text-align:center;
  margin-bottom: 1rem;
  line-height: 1.2125em;
}


@media (max-width:767px){
.page-title{
  padding: 24px 15px;
  font-size: 18px;
}
}
  
.text-component ol li {
  line-height: calc(var(--body-line-height) * var(--line-height-multiplier, 1));
}

#toc {
  margin-bottom: 30px;
}

#tldr {
  background-color: #FFDB00;
  margin: 0px auto 30px auto;
  padding: 1rem 1rem 0 1rem;
}

#tldr ol {
  list-style: none;
  counter-reset: mycounter;
  flex-wrap: wrap;
  margin: 0;
  padding: 1.5rem;
}
#tldr ol li {
  counter-increment: mycounter;
    display: flex;
  margin-bottom: 1rem;
}
#tldr ol li::before {
  content: "#" counter(mycounter);
  font-weight: bold;
  font-size: 2rem;
  line-height: 1;
  margin-right: 0.5rem;
}

#tldr ul {
  list-style: none;
  flex-wrap: wrap;
  margin: 0;
  padding: 1.5rem;
}
#tldr ul li {
  counter-increment: mycounter;
    display: flex;
  margin-bottom: 1rem;
}
#tldr ul li::before {
  content: "#";
  font-weight: bold;
  font-size: 2rem;
  line-height: 1;
  margin-right: 0.5rem;
}

/* location display */

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  grid-gap: .5rem;
  align-items: flex-start;
}

.grid-container > div {
  background-color: #FFDB00;
  padding: 1rem;
}

/* product description */

.tracklist {
  float: left;
  margin-right: 1em;
}
.playlist {
  float: left;
}

/* Clear floats after the columns */
.recorddetails:after {
  content: "";
  display: table;
  clear: both;
}

/* New style start here */

.banner-link{
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 222;
  top: 0;
  left: 0;
}

.hero-slideshow .carousel__item{
  position: relative;
}

.hero-slideshow__banner{
  height: 100%;
  min-height: 28vw;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
} 


/*.hero-slideshow__banner{
  min-height: 23vw;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  min-height: auto;
  height: calc(100vh - 316px)
} */

.hero-bottom{
  padding-top: 50vh;
  padding-bottom: 0;
  background-size: contain;
  background-color: #fff;
}

.carousel__navigation button{
  background: gray !important;
  opacity: 1;
}

.carousel__navigation .carousel__nav-item.carousel__nav-item--selected button{
  background: #FFDB00 !important;
}
.carousel__navigation--pagination{
  bottom: -17px;
}
.main-header__nav-grid .main-header__list .main-header__dropdown li{
  position: relative;
}

.gui-page-title{
  background: #000;
  color: #FFDB00;
  padding: 24px;
  text-transform: uppercase;
  font-family: 'Century Gothic', sans-serif;
  font-weight: 700;
  font-size: 52px;
}

#blog-list-foot{
  text-align:center;
}

@media (min-width: 64rem){
.main-header__dropdown .main-header__dropdown-item:nth-child(n+8) .main-header__dropdown{
  top:auto !important;
  bottom:-20px !important;
}
}

@media (max-width:1024px){
.hero-slideshow__banner{
  height: calc(65vh - 316px);
  background-size: contain;
  background-color: #ffff;
  }
.main-header__link{
  display:inline-block;
}
.main-header__item{
  position: relative;
}
.main-header__arrow-icon{
  position: absolute;
  right: 0;
  top: 11px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.main-header__dropdown li:first-child{
  display:none !important;
}
.hero-bottom{
  padding-top: 34.6vh;
}
}

@media (max-width:992px){
.hero-bottom{
  padding-top: 25.6vh;
}
}

@media (max-width:767px){
.hero-slideshow__banner{
  height: 21vh;
}
.hero-bottom{
  padding-top: 15.6vh;
}

.gui-page-title{
  padding: 24px 15px;
  font-size: 18px;
}
  
@media only screen and (orientation: landscape) {
.hero-slideshow__banner{
  background-size: cover;
  height: 67vh;
}
}
}

/* This part of the CSS code ensures the link to the Back Office and the close button are hidden. */
.wsa-demobar a, .wsa-demobar a.close {
display: none !important;
}

/* This part of the CSS code ensures the USP bar is no longer visible when scrolling like the original demobar. */
.wsa-demobar{
position: absolute !important;

/* This part of the CSS code controls the background and font color of the the USP bar. Search online for any colour in 'hex' and replace the number below. #000000 is black, #ffffff is white. */
background-color: #000000 !important;
color: #ffffff !important; }

/* This part of the CSS code ensures the USP bar is hidden for mobile visitors. When a screen is smaller than 767 pixels wide, the USPs will not fit properly. */
@media screen and (max-width: 767px){
.wsa-demobar{
display: none !important;
}
body {
margin-top: 0px!important;
}
}
