p a {color: #0044cc; text-decoration: underline; font-weight: bold;}
p a:hover {text-decoration: underline; background-color: #f8f8f8;}

.slider-container {position: relative; overflow: hidden; width: 100%; max-width: 1200px; margin: auto; touch-action: pan-y;}
.slider-wrapper {display: flex; transition: transform .5s ease-in-out; width: 100%;}
.slider-slide {flex: 0 0 100%; position: relative;}
.slider-slide img {max-width: 100%; height: auto; display: block; object-fit: contain;}
.slider-bar {height: 100%; box-sizing: border-box; font-family: var(--fontSerif); text-align: left; position: absolute; width: 300px; bottom: 0; display: flex; left: 3%; background: #003; color: #fff; padding: 3%; flex-direction: column; align-items: flex-start; opacity: .8; justify-content: center;}
.one {font-size: 1.9rem; letter-spacing: -1px;}
.two {font-size: 1.2rem; margin: 10px 0 9px 0; letter-spacing: -1px;}
.four {font-family: var(--fontSansSerif); height: 25px; margin: 17px 0 0; border: 1px solid #fff; padding: 12px 15px; color: #c39b00; display: flex;}
.slider-button {position: absolute; top: 50%; transform: translateY(-50%); border: none; padding: 25px; cursor: pointer; z-index: 10; display: block;}
.slider-button.prev {left: 10px;}
.slider-button.next {right: 10px;}
#banners .prev, #banners .next {color: white; background: rgba(0, 0, 0, .5);}
#featArtist .prev, #featArtist .next {color: #333; background: rgb(239 239 239);}
.feat-css {background-color: #be7836 !important;}
.right-box-hm {text-align: left; min-width: 150px;}
.right-box-hm h3 {display: block; font-size: 1.6rem;}
.left-box-hm {min-width: 150px;}
.FeatArtistsContainer {display: flex; flex-wrap: wrap; justify-content: center; gap: 5%; flex-direction: row; align-items: center; margin: 15px 0 0;}
section header h2 {font-family: var(--fontSerif); color: #333; font-size: 1.6rem; letter-spacing: -1px; border-left: 2px solid #9999994a; padding: 0 0 0 18px; margin: 0 0 0 10px;}
#aboutUs h1 {font-family: var(--fontSerif); color: #333; font-size: 1.6rem; letter-spacing: -1px; margin: 0 0 0 10px;}
#aboutUs img {object-fit: contain; max-width: 30%; height: auto;}

.NewsStrip {display: flex; flex-direction: column;}
.FlexContainer {display: flex; flex-direction: row; gap: 12px;}
.NewsStrip header {margin: 25px 10px;}
.NewsStrip article {display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: left; margin: 0 0 50px 0;}
.NewsStrip h3 {display: block; font-size: 22px; font-weight: 400; line-height: 32px; vertical-align: baseline; color: #474747; font-family: var(--fontSerif); font-style: normal; text-decoration: none; padding: 0 0 12px 0; margin: 0 0 8px 0; border-bottom: 1px #e5e5e5 solid;}
.NewsStrip span {font-family: var(--fontSansSerif);}
.NewsStrip article div {width: 85%;}
.NewsStrip img {height: auto;}
.LatestUpdates .FlexContainer > a {display: block; flex: 1 1 0; min-width: 0;}
.LatestUpdates article {height: 100%; align-items: stretch;}
.LatestUpdates .NewsCardImage {width: 100%; height: 180px; display: flex; align-items: center; justify-content: center; background: #f7f7f4; overflow: hidden; padding: 10px; box-sizing: border-box;}
.LatestUpdates .NewsCardImage img {width: 100%; height: 100%; object-fit: contain;}
.LatestUpdates .NewsCardContent {width: 100%;}
.LatestUpdates .NewsCardContent p {margin: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;}

@media (max-width: 670px) {
  .FlexContainer {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;}
  .FlexContainer > a {display: block;}
  .NewsStrip article div {width: 100%;}
  .NewsStrip img {width: 100%; height: auto;}
}

@media only screen and (min-width: 320px) and (max-width: 670px) {
  .slider-bar {font-family: var(--fontSerif); position: absolute; bottom: 5%; width: 80%; display: flex; left: 11%; background: #000033; color: #fff; padding: 4%; text-align: center; flex-direction: column; align-items: center; height: unset;}
  .two {font-size: 1.2rem; margin: 4px 0 2px 0;}
  .slider-button {display: none;}
  #fine-art-categories article {min-height: 240px;}
  section {display: block; float: left; position: relative; margin: 20px 0;}
  .left-box-hm {display: flex; flex-direction: column; align-items: center;}
  .right-box-hm {display: flex; align-items: center; flex-direction: column; width: 90%; margin: 20px 0 0;}
  #aboutUs img {max-width: 100%;}
  div.container {display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; flex-direction: column; align-items: center;}
}

section#aboutUs {background-color: #e1dad43b; padding: 30px 0 0; border-radius: 5px; box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, .15); color: #333;}
section div.inlineContainer {display: inline-block; width: 100%;}
section header {font-style: normal; font-weight: 500; height: auto; display: flex; font-size: 1.2rem; text-align: left; margin: 25px auto 10px; flex-direction: row; align-items: center; justify-content: space-between;}
section h2 {font-size: 1.6rem;}
section h2 a:link,
section h2 a:visited {color: #003;}
section {width: 95%; margin: 12px auto 20px;}
#home nav {display: flex; justify-content: flex-end;}
#fine-art-categories article {width: 35%; margin: 0 0 25px; display: flex; flex-direction: row; align-items: flex-start; align-content: flex-start; justify-content: center; flex: 0 1 calc(50% - 10px); max-width: calc(50% - 10px); box-sizing: border-box; text-align: center;}
#fine-art-categories img {margin: 0; height: auto; max-width: 100%;}
#fine-art-categories div.container {display: flex; column-gap: 2%; flex-direction: row;}
#aboutUs h1 {font-size: 1.9rem; line-height: 32px; margin: 0 0 20px;}
#aboutUs h2 {font-family: var(--fontSansSerif); font-size: 14px; color: #333; letter-spacing: unset;}
#aboutUs h3 {font-family: var(--fontSerif); font-size: 1.5rem; letter-spacing: -1px; font-weight: 600; color: #333;}
#aboutUs span,
.grey-button-hm,
section#aboutUs #button {font-family: var(--fontSansSerif);}
#aboutUs article {display: flex; flex-direction: column; align-items: center; width: 30%;}
#aboutUs #details {width: 80%;}
section#aboutUs div.inlineContainer {display: flex; width: 100%; flex-direction: row; align-items: center; justify-content: space-around;}
.grey-button-hm {display: block; font-size: 14px; width: auto; padding: 12px; background-color: #efefef; transition: var(--transition);}
.grey-button-hm:hover {background-color: #e5e5e5;}
section#aboutUs #button {border: 1px solid #c39b00; padding: 8px; margin: 12px 0 0; font-size: .9rem; border-radius: 5px; display: block; cursor: pointer; color: #333;}
section#aboutUs #button:hover {background-color: #fff; color: #333;}

@media (max-width: 768px) {
  section {width: 95%; margin: 22px 2% 50px;}
  section header {align-items: center; justify-content: center;}
  section#aboutUs div.inlineContainer {display: flex; width: 100%; flex-direction: column; align-items: center; justify-content: space-around;}
  #aboutUs article {display: flex; flex-direction: column; align-items: center; width: 100%; margin: 20px; box-sizing: border-box;}
}
