/* Fonts */
body,
input,
textarea,
select,
.nunito-sans {
  font-family: "Nunito Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100,
    "YTLC" 500;
}

.picks-section .picks-heading,
.banner-section .banner-title,
.body-title,
.marcellus-regular {
  font-family: "Marcellus", serif;
  font-weight: 400;
  font-style: normal;
}



/* Custom Classes */
.bg-dark-blue { background-color: #336699 !important; }
.text-dark-blue { color: #336699 !important; }

.btn-light-brown { color: #987455 !important; }
.btn-light-brown:hover,
.btn-light-brown:focus { background-color: #987455 !important; border-color: #987455 !important; color: #fff !important; }

.btn-dark-brown { background-color: #987455 !important; border-color: #987455 !important; color: #fff !important; }
.btn-dark-brown:hover,
.btn-dark-brown:focus { background-color: #fff !important; border-color: #987455 !important; color: #987455 !important; }

.btn-outline-dark-blue { border-color: #336699 !important; color: #336699 !important; }
.btn-outline-dark-blue:hover,
.btn-outline-dark-blue:focus { border-color: #336699 !important; color: #fff !important; background-color: #336699 !important; }
.dropdown-hover-all .dropdown-menu,
.dropdown-hover > .dropdown-menu.dropend { margin-left: -1px !important }

/* Custom CSS */
.stuck { position: fixed; top: 0; left: 0; right: 0; z-index: 10; }

.header-main { position: relative; z-index: 50; }
.pre-header { background-color: #987455; color: #fff; }
.post-header { background-color: #fff; }
.header-navs { }
.header-navs.nav { font-size: 1.2rem; }
.header-navs.nav > li > a { color: #8E92A8; font-weight: 300; position: relative; padding: 0.6rem 0.6rem; }
.header-navs.nav > li > a:before { content: ""; position: absolute; bottom: -0.4rem; background-color: #999; left: 50%; right: 50%; height: 0.15rem; transition: all 0.25s ease-in-out; }
.header-navs.nav > li > a.active { color: #987455; font-weight: 900; }
.header-navs.nav > li > a.active:before { /*content:""; position:absolute; bottom:-0.4rem; height:0.15rem;*/ background-color: #987455; left: 1rem; right: 1rem; }
.header-navs.nav > li > a:hover,
.header-navs.nav > li > a:focus { color: #987455; }
.header-navs.nav > li > a:hover:before { left: 1rem; right: 1rem; }

.header-navs.nav .nav-link:focus-visible { box-shadow: none; }
.header-navs.nav .dropdown-toggle::after { /*margin-left: 0rem;*/ }
.dropdown-menu { border: 0; padding: 0; border-radius: 0; margin-top: 0.4rem !important; }
.dropdown-menu .dropdown-item { padding: 0.5rem 1rem; color:#fff; }

.dropdown-menu > li:nth-child(-n+6) > .dropdown-item { color:#333; }
.dropdown-menu > li:nth-child(1) > .dropdown-item { background-color: #987455; color: #fff; }
.dropdown-menu > li:nth-child(2) > .dropdown-item { background-color: #89684d; color: #fff; }
.dropdown-menu > li:nth-child(3) > .dropdown-item { background-color: #7a5d44; color: #fff; }
.dropdown-menu > li:nth-child(4) > .dropdown-item { background-color: #6a513b; color: #fff; }
.dropdown-menu > li:nth-child(5) > .dropdown-item { background-color: #5b4633; color: #fff; }
.dropdown-menu > li:nth-child(6) > .dropdown-item { background-color: #4c3a2b; color: #fff; }
.dropdown-menu > li:nth-child(7) > .dropdown-item { background-color: #3d2e22; color: #fff; }
.dropdown-menu > li:nth-child(8) > .dropdown-item { background-color: #2e2319; color: #fff; }
.dropdown-menu > li:nth-child(9) > .dropdown-item { background-color: #0f0c08; color: #fff; }
.dropdown-menu > li:nth-child(10) > .dropdown-item { background-color: #000000; color: #fff; }
.nav-item > .dropdown-menu { }

.logo { padding: 0.3rem 0.6rem; }
.logo img { max-height: 120px; }

.header-icons { }
.header-icons .nav { font-size: 1.4rem; }
.header-icons .nav > li > a { color: #33363F; padding: 0.2rem 0.6rem 0; }
.header-icons .nav > li > a:hover,
.header-icons .nav > li > a:focus { color: #987455; }

.body-title { color: #987455; margin-bottom: 3.5rem; }
.body-title h1 { font-size: 2.8rem; font-weight: 400; }

.collection-section { background-repeat:repeat; background-size:contain; background-position:center; background-attachment: fixed; margin-bottom: 4rem; position: relative; }
.collection-section:before { content:""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #F7EFDADB; opacity: 0.8; z-index: 5; }
.collection-section .body-content { position: relative; z-index: 10; }
.collection-item { margin-bottom: -34px; position: relative; }
.collection-item:before { content:""; border-radius: 50%; background-color: #987455; position: absolute; top: 3.2rem; width: 60%; margin-left:20%; padding-bottom: 60%; z-index: 5; }
.collection-item a { display: block; text-align:center; text-decoration:none; text-transform: uppercase; color: #987455; font-size: 1.0rem; font-weight: 900; z-index: 10; position: relative; }
.collection-item a span { display: block; }
.collection-item .collection-img { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:100%; }
.collection-item .collection-title { padding-top: 10px; }

.banner-section { background-repeat:no-repeat; background-size:cover; background-position:top center; background-attachment: fixed; position: relative; color: #fff; padding: 1rem; }
.banner-section:before { content:""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #F7EFDADB; opacity: 0.8; z-index: 5; }
.banner-section .body-content { position: relative; z-index: 10; background-color: rgba(152, 116, 85, 0.64); border: 3px solid #ddd; padding: 5rem 6rem; font-size: 1.4rem; }
.banner-section .banner-title { font-size: 3.2rem; font-weight: 400; }

.explore-section { padding: 4rem 0; }
.explore-section .body-content { }
.explore-section .body-footer { padding-top: 2rem; }
.explore-section .explore-item { }
.explore-section .explore-figure { }
.explore-section .explore-figure a { display: block; color: #000; text-decoration: none; }
.explore-section .explore-figure a span { display: block; }
.explore-section .explore-img { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:125%; border-radius: 1rem; }
.explore-section .explore-title { padding: 0.5rem 0.8rem 0; }
.explore-section .explore-area { padding: 0 0.8rem 0.5rem; }
.explore-section .explore-price { font-weight: 700; color: #000; font-size: 1.2rem; }
.explore-section .explore-price span { color: rgba(131, 131, 131, 1); text-decoration: line-through; }

.picks-section { background-color: #F7EFDA; }
.picks-section .body-content { padding: 1rem 0; }
.picks-section .picks-contain { font-size: 1.4rem; color: #987455; }
.picks-section .picks-heading { font-size: 2.6rem; }
.picks-section .picks-item { position: relative; }
.picks-section .picks-item a { display: block; color: #000; text-decoration: none; }
.picks-section .picks-item a span { display: block; }
.picks-section .picks-img { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:125%; border-radius: 1rem; }
.picks-section .picks-title { position: absolute; bottom: 1rem; right: 1rem; left: 1rem; color: #fff; }
.picks-section a.picks-cart { position: absolute; top: 1rem; right: 1rem; background-color: rgb(152, 116, 85); color: #F7EFDA; opacity: 0.8; width: 2.5rem; height: 2.5rem; border-radius: 50%; padding: 0.4rem; text-align: center; font-size: 1.2rem; }
.picks-section a.picks-cart:hover { opacity: 1; }

.lookbook-section { background-color: #987455; padding: 4rem 0 8rem; clip-path: ellipse(85% 100% at top); }
.lookbook-section .body-title { color: #fff; }
.lookbook-section .lookbook-item { }
.lookbook-section .lookbook-item a { display: block; }
.lookbook-section .lookbook-item a span { display: block; }
.lookbook-section .lookbook-img { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:125%; border-radius: 1.5rem; }

.arrival-section { padding: 4rem 0; }
.arrival-section .arrival-item { }
.arrival-section .arrival-figure { position: relative; }
.arrival-section .arrival-figure a { display: block; position: relative; }
.arrival-section .arrival-figure a span { }
.arrival-section .arrival-link { }
.arrival-section .arrival-img { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:125%; border-radius: 1rem; display: block; }
.arrival-section .arrival-info { position: absolute; top: 1rem; left: 1rem; }
.arrival-section .arrival-sales { }
.arrival-section .arrival-new { }
.arrival-section a.arrival-wishlist { position: absolute; top: 1rem; right: 1rem; background-color: rgb(152, 116, 85); color: #F7EFDA; opacity: 0.8; width: 2.5rem; height: 2.5rem; border-radius: 50%; padding: 0.4rem; text-align: center; font-size: 1.2rem; }
.arrival-section a.arrival-wishlist:hover { opacity: 1; }
.arrival-section a.arrival-cart { background-color: rgb(152, 116, 85); color: #F7EFDA; opacity: 0.8; width: 2.5rem; height: 2.5rem; border-radius: 50%; padding: 0.4rem; text-align: center; font-size: 1.2rem; display: inline-block; }
.arrival-section a.arrival-cart:hover { opacity: 1; }
.arrival-section .arrival-area { padding-top: 0.8rem; }
.arrival-section .arrival-title { font-size: 1.2rem; }
.arrival-section .arrival-price { font-weight: 700; color: #000; font-size: 1.2rem; }
.arrival-section .arrival-price span { color: rgba(131, 131, 131, 1); text-decoration: line-through; }

.presentation-section { }
.presentation-section .presentation-content { background-repeat:no-repeat; background-size:cover; background-position:top center; padding-bottom:66%; }

footer { color: #fff; background-color: #987455; padding: 4rem 0; }
footer { }
.pre-footer { padding-bottom: 2rem; }
footer a,
.pre-footer a { color: #fff; text-decoration: none; position: relative; }
footer a:hover,
footer a:focus,
.pre-footer a:hover,
.pre-footer a:focus { color: #EBF0F5; }
.col-footer .footer-title { font-size: 1.2rem; font-weight: 700; margin-bottom: 1rem; }
.col-footer .nav-link { padding-left:0; padding-right:0; }
.footer-socials { }
.footer-socials a { background-color: rgb(152, 116, 85); color: #ffff; border: 1px solid #fff; width: 2.5rem; height: 2.5rem; border-radius: 50%; padding: 0.4rem; text-align: center; font-size: 1.2rem; display: inline-block; }
.footer-socials a:hover { background-color: #fff; color: rgb(152, 116, 85); }
.post-footer { border-top: 1px solid #fff; padding-top: 2rem; }

/* Inner Pages */
.banner-figure { position: relative; }
.banner-figure .ratio-21x9 {  --bs-aspect-ratio: 25%;
}
.banner-figure .figure-caption { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); text-align: center; color: #336699; width: 100%; text-shadow: 0 0 1rem rgba(0, 0, 0, 0.5); font-size: 6rem; line-height: 1; }

/************************************* Responsive Media Queries ***************************************/

/* 'sm' applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {


}

/* 'md' applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	
	.banner-section .banner-title,
	.picks-section .picks-heading,
	.body-title h1	{ font-size: 2rem; }
	.banner-section .body-content { font-size: 1.2rem; }
	.pre-footer { text-align: center; }
	
}

/* 'lg' applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	.header-navs.nav { flex-direction: column; text-align: center; }
	.header-navs.nav > li > a:before { display: none; }
	.nav-item > .dropdown-menu { position: static; }
	.dropdown-menu .dropdown-item { text-align: center; }
	.header-icons { padding-bottom: 1rem; }
	.collection-section { margin-bottom: 0; }
	.collection-item { margin-bottom: 0; }
	.banner-section .body-content { padding: 3rem 2rem; }
	
}

/* 'xl' applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
}

/* 'xxl' applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
}
 @media (min-width: 576px) and (max-width: 767.98px) {

}
@media (min-width: 768px) and (max-width: 991.98px) {

}
@media (min-width: 992px) and (max-width: 1199.98px) {


}
}
@media (min-width: 1200px) and (max-width: 1599.98px) {

}
@media (min-width: 1400px) and (max-width: 1599.98px) {
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
}

/*X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
}

/* XX-Large devices (larger desktops, 1600px and up) */
@media (min-width: 1600px) {
}
