.profilepage .profileimage {margin-left:10px;}
.profilepage .profilehead{margin-left: 40px;display:flex;}
.profileimage {flex:0 0 250px;}
.prfoledesc {margin-left:40px;}
.profilepage h2{color:black;font-size: 1.2em;margin-left: 40px;}

.navandsearch .search-form {
  width:100%;
  display:flex;
  justify-content:center
}
#bn-search {
  display:flex;
  width:100%;
  flex-wrap:nowrap;
  align-content:center
}
.bn-search-input {
  flex:calc(100% - 150px)!important
}
.bn-search-input input[type=search] {
  margin:8px 0;
  font-size:17px;
  border:none;
  border:1px solid gray;
  width:100%;
  background:#fff
}
.bn-search-button {
  flex:40px
}
.bn-search-button button {
  background:0 0;
  font-size:27px
}
.bn-search-close {
  display:flex;
  flex:10px;
  margin:8px 0;
  justify-content:center;
  align-content:center
}
.bn-search-close a {
  color:#000;
  padding:12px;
  text-decoration:none;
  font-size:1.5em;
  background:#fff
}
@media(min-width:49em) {
  #bn-search {
	z-index:85;
	transition:.5s;
	opacity:0%;
	width:0;
	height:0;
	overflow:hidden
  }
  .bn-search-button button {
	background:#fff;
	margin:3px 0;
	font-size:27px
  }
  #bn-search.showsearchdt {
	overflow:hidden;
	transition:.5s;
	opacity:100%;
	position:absolute;
	top:-12px;
	right:0;
	margin:0;
	padding:0 30px;
	z-index:800;
	background-color:rgba(255,255,255,.547);
	width:100%;
	height:auto;
	display:flex;
  border:none;
  }
}
@media(min-width:49em) {
  .bn-search-button button {
	color:#000
  }
  .bnmainnav {
	position:absolute;
	top:30px;
	display:inline-block;
	font-weight:700
  }
  @media(min-width:49em) {
	.bnmainnav {
	  right:5px;
	  font-size:12px
	}
  }
  @media(min-width:1400px) {
	.bnmainnav {
	  right:calc((100% - 1400px)/2);
	  font-size:14px
	}
  }
  .bnmainnav ul {
	position:relative;
	z-index: 400;
	display:flex;
	flex:1 1 auto;
  min-width: 200px;
	margin:0;
	padding:0 30px;
	list-style-type:none;
	li:not(:last-child) {
	  margin-right:20px;
	}
	
  }
  
 .bnmainnav ul li {
    border:2px solid transparent;
    border-radius:5px;
    transition:background 0.2s;
    padding:10px;
 
 
   
  }
  
 .bnmainnav ul li:hover {
  background:#76ee4a;
  border:2px solid rgba(118,238,74,0.825);
  
  
  }
  
 .bnmainnav ul li:hover a  {
    color:#F9F8FD;
  }
  
 .bnmainnav ul li:hover ul  {
    visibility:visible;
    opacity:1;
    box-shadow:0px 3px 5px 2px rgba(4,4,5,0.225);
    
  }
  
  .bnmainnav ul li:hover ul li a {color: black;font-weight: normal;}
  
 .bnmainnav ul li  a {
  color:#000000;
  text-decoration:none;
  text-transform:uppercase;
  transition:color 0.2s;
  padding:10px;
  }
  
  
 .bnmainnav ul li  ul {
  visibility:hidden;
  opacity:0;
  position:absolute;
  display:block;
  margin:12px -12px;
  padding:0;
  background:rgba(255,255,255,0.95);
  border:2px solid #ffffff;
  border-radius:5px;
  transition:opacity 0.2s,visibility 0.2s;
  li {
    margin:0 -2px 0 0px;
    width:calc(100%);
    line-height:1.7;
    a {
    font-weight:normal;
    color:#000000!important;
    }
  }
  }
  
  
  @keyframes slide-in {
	0% {
	  top:-50px
	}
	40% {
	  top:20px
	}
	70% {
	  top:10px
	}
	100% {
	  top:15px
	}
  }
}
.bnmainheader {
  border-bottom:5px #00f700 solid;
  padding:5px;
  background:#fff
}
.closebtn {
  display:none
}
@media(max-width:49em) {
  .bn-search-close {
	display:none
  }
  .bnmainnav ul li {
	  transition:background 0.2s;
	  
	
  }
  
  
  .bnmainnav ul li a  {
  padding-top:30px;
  color:#ffffff;
  text-decoration:none;
  text-transform:uppercase;
  transition:color 0.2s;
  border-bottom:rgba(0,247,0,0.502) 1px solid;
  }
  
  
  .bnmainnav ul li  ul {
    display:flex;
    flex-wrap:wrap;
    margin:12px -12px;
    padding:0;
    padding-left:20px;
    border-radius:5px;
    transition:opacity 0.2s,visibility 0.2s;
  
    
  }
  
  
  .bnmainnav ul li  ul li {
    margin:0 -2px 0 0px;
    width:46%;
    margin:1px;
    
  }
  
  
 .bnmainnav ul li  ul li a {
  font-size:smaller;
  color:#acbccf;
  background:none;
  border:none;
  }
  
  
  .bnlogoheader {
	display:inline-block
  }
  .hamberder {
	display:inline-block;
	padding:20px;
	float:right
  }
  .bnmainlogo {
	width:100px
  }
  .bnmainlogo a img {
	width:100%
  }
  .navandsearch {
	height:100%;
	width:0;
	position:fixed;
	z-index:10000000;
	top:0;
	right:0;
	background-color:rgba(17,17,17,.931);
	overflow-x:hidden;
	transition:.3s;
	padding-top:5px
  }
  .navandsearch.bnresponsive {
	width:100%
  }
  .navandsearch.bnresponsive .closebtn {
	display:block;
	color:#fff;
	text-align:right;
	padding:10px;
	font-size:30px;
	text-decoration:none;
	margin-right:18px
  }
  @keyframes menunavbn {
	0% {
	  right:0
	}
	100% {
	  right:100%
	}
  }
  .bnmenuitem {
	display:block;
	padding:10px
  }
}
@media(min-width:49em) {
  .hamberder {
	display:none
  }
  .bnheadercontainer {
	width:100%;
	max-width:1400px;
	margin-left:auto;
	margin-right:auto;
	display:flex
  }
  .bnmainlogo {
	width:150px
  }
  .bnmainlogo a img {
	width:100%
  }
  .navandsearch {
  }
}
#footer {
  background:#222
}
#footer a {
  color:#d3d3d3
}
.social-links,
.sl-second-tier {
  display:flex;
  align-items:center;
  justify-content:center
}
.social-links a {
  height:60px;
  width:60px;
  padding:12px;
  margin:5px;
  border-radius:10px
}
.sl-second-tier a {
  height:40px;
  width:40px;
  padding:8px;
  margin:5px;
  border-radius:10px
}
.sl-second-tier a img,
.social-links a img {
  filter:invert(100%)
}
.sl-second-tier a:hover img,
.social-links a:hover img {
  filter:none
}
#copyright,
#copyright a {
  color:#8a8a8a;
  font-size:smaller
}
.center {
  text-align:center
}
.sl-second-tier a:hover,
.social-links a:hover {
  background:#fff
}
.twitter {
  background:#000
}
.twitter_old {
  background:#1d9bf0
}
.mastodon {
  background:#6364ff
}
.facebook {
  background:#1877f2
}
.youtubey {
  background:red
}
.instagram {
  background:#c13584
}
.tiktok {
  background:#fe2c55
}
.rss {
  background:#f26522
}
.reddit {
  background:#f26522
}
.linkedin {
  background:#0077b5
}
.fa-twitch {
  background:#6441a5
}
.fa-itch-io {
  background:#ff2449
}
.tumblr {
  background:#35465c
}
.telegram {
  background:#27a7e7
}
.patreon {
  background:#ff424d
}
.pinterest {
  background:#e60023
}
.fa-google {
  background:#4285f4
}
.fa-pixelfed {
  background:#f42c45
}
.fa-peertube {
  background:#f16804
}
.threads {
  background:#000
}
.cbox-2,
.cbox-4 {
  padding:20px
}
.border-1 {
  order:1
}
.border-2 {
  order:2
}
@media only screen and (min-width:800px) {
  .cbox-wrap {
	display:flex;
	margin-left:auto;
	margin-right:auto;
	justify-content:space-between
  }
  .cbox-4 {
	width:24%
  }
  .cbox-2 {
	width:48%
  }
  .border-1 {
	order:2
  }
  .border-2 {
	order:1
  }
}
#footer h3 {
  margin-left:20px;
  padding:0;
  text-decoration:underline;
  text-decoration-color:#76ee4a
}
#footer p,
#footer ul {
  padding:20px
}
#footer {
  color:#fff
}
#prefooter {
  height:180px;
  background:url(/wp-content/themes/bn/images/background2.png);
  background-position-x:0%;
  background-position-y:0%;
  background-repeat:repeat;
  background-size:auto;
  background-size:1480px;
  background-repeat:repeat-x;
  background-position:bottom;
  padding-bottom:120px
}
.gs-result,
.gs-snippet,
.gs-result {
  font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen-Sans,Ubuntu,Cantarell,helvetica neue,sans-serif!important;
  font-size:16px!important;
  line-height:normal!important
}
.bnmodal {
  display:none;
  position:fixed;
  z-index:1;
  left:0;
  top:0;
  width:100%;
  height:100%;
  overflow:auto;
  background-color:#000;
  background-color:rgba(0,0,0,.4)
}
.bnmodal-header {
  padding:10px;
  background:red;
  color:#fff
}
.bnmodal-header h2 {
  margin:0!important;
  padding:10px;
  color:#fff
}
.bnmodal-warning {
  background:red
}
.bnmodal-content {
  background-color:#fefefe;
  margin:15% auto;
  border:1px solid #888;
  width:80%;
  box-shadow:0 4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);
  animation-name:animatetop;
  animation-duration:1s
}
.bnmodal-body {
  background-color:#fefefe;
  padding:20px;
  padding:20px
}
.bnmodalclosex {
  color:#fff;
  float:right;
  font-size:28px;
  font-weight:700
}
.bnmodalclosex:hover,
.bnmodalclosex:focus {
  color:#000;
  text-decoration:none;
  cursor:pointer
}
.bnmodalcancel {
  display:inline-block;
  padding:20px
}
.bnmodalcancel:hover {
  cursor:pointer!important
}
.bnmodal-footer {
  text-align:center;
  padding:10px
}
.bnmodal-footer button {
  margin:10px
}
@keyframes animatetop {
  from {
	top:-300px;
	opacity:0
  }
  to {
	top:0;
	opacity:1
  }
}
.bn_yoursotd {
  background:#eee;
  border-radius:10px;
  margin:10px;
  padding:20px;
  color:#000
}
.bn_yoursotd h4 {
  margin:0;
  padding:0;
  padding-bottom:10px;
  padding-top:10px
}
.bn_yoursotd textarea {
  width:100%;
  height:100px
}
.charNum {
  text-align:right
}
.bn_yoursotd .contentRow {
  display:flex
}
.bn_yoursotd .contentRow .contentRow-figure {
  width:100px
}
.bn_form_button_row {
  padding:10px;
  text-align:right
}
.bn_yoursotd .inputGroup {
  padding:10px
}
.bn_yoursotd .contentRow .contentRow-main {
  padding-left:10px
}
.bn-row {
  display:flex
}
.abclist {
  position:sticky;
  background:#fff;
  top:-1px
}
.abclist.is-pinned {
  background:red
}
.abc li {
  display:inline
}
.abc li a {
  padding:10px;
  text-decoration:none;
  color:#000;
  font-size:larger;
  background:#eee;
  margin-right:5px;
  margin-bottom:5px;
  line-height:49px
}
.fragnotes {
  order:2
}
.peepsandcomps {
  order:1
}


.toppartoffragdir {
  color:#000;
  display:flex;
  flex-wrap:wrap
}
@media(min-width:500px) {
  .toppartoffragdir {
	color:#000;
	display:flex;
	flex-wrap:nowrap
  }
}
@media(min-width:1200px) {
  .fragmiddle {
	color:#000;
  }
}
.toppartoffragdir {
  color:#000;
  display:flex;
}
.fragshops h3 {

}
.bn_sidelist {
  margin:0!important;
  padding:10px!important;
  margin-right:20px!important;
  min-width:260px
}
.bn_sidelist img {
  filter:brightness(95%);
  border-radius:5px
}
.bn_sidelist li {
  margin:0;
  padding:0;
  margin-bottom:10px
}
.bn_sidelist li a {
  color:#000;
  display:flex;
  text-decoration:none;
  font-size:smaller
}
.bn_sidelist li a .bn_card_img {
  width:55px;
 /* background:rgba(0, 0, 255, 0.427);*/
min-width:70px;
}

.bn_card_text b {line-height: 1.1em;}

.bn_sidelist li a .bn_card_text {
  margin:0;
  align-items:top!important;
 /* background: rgba(255, 0, 0, 0.405);*/
}
.peepsandcomps .bn_sidelist {
  width:280px;
}
.peepsandcomps {
  border-right:rgba(209, 207, 207, 0.332) 1px solid;
  width:280px;
/*  background: palegoldenrod;*/
}
@media(min-width:1200px) {
  .bn_sidelist {
	margin:0!important;
	/*padding:10px!important;*/
/*	margin-top:20px!important;*/
	margin-right:20px!important;
	/* min-width:320px */
  }
  .bn_sidelist img {
	width:60px;
	filter:brightness(95%);
	border-radius:5px;
  }
  .bn_sidelist li {
	margin:0;
	padding:0;
	margin-bottom:10px;
  }
  .bn_sidelist li a {
	color:#000;
	display:flex;
	text-decoration:none;
  }
  .bn_sidelist li a .bn_card_img {
	width:70px;
  }
}
.fragrancenotes,
.fragrancenotes ul,
.fragrancenotes ul ul {
  text-align:center;
  margin:0!important;
  padding:0!important;
  list-style:none
}
.fragrancenotes {
  padding:20px 0 40px!important;
  background:url(https://basenotes.com/2023/bnassets/images/triangle.svg) no-repeat center
}
.fragrancenotes li ul {
  padding:0 20px!important
}
.fragrancenotes li ul li {
  display:inline;
  padding:10px
}
.fragrancenotes li h3 {
  text-decoration:underline;
  font-size:16px;
  color:#000;
  margin:0;
  padding:10px
}
.parfumtextlist li,
.parfumtextlist li ol {
  list-style:none;
  margin:0;
  padding:0
}
.yearheading h3 {
  margin:0;
  font-size:x-large;
  color:#000;
  font-weight:700;
  padding:10px;
  border-bottom:1px solid #000;
  display:inline-block
}
.yearheading ol {
  margin:0;
  padding:0;
  padding-left:20px!important;
  margin-left:20px!important;
  border-left:#000 1px solid;
  padding:20px!important;
  padding-bottom:50px!important
}
.yearheading ol li {
  font-weight:400;
  font-size:normal
}
.yearheading ol li a {
  color:#000;
  text-decoration:none;
  display:inline-block;
  padding:10px!important
}
.yearheading ol li a:hover {
  text-decoration:underline
}

  .fragmiddle {
padding-bottom: 20px;
}


@media(max-width:1053px) {
  .fragmiddle {
	flex-wrap:wrap
  }
}
.fraghead-inner2 {
  display:flex;
  padding:1rem;
  background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));
  min-height:120px
}
.fragheadinner {
  min-height:120px
}
.product_image {
  text-align:center
}
@media(min-width:700px) {
  .product_image {
	margin-top:-240px;
	display:inline-block;
	width:230px;
	margin-left:10px;
	margin-bottom:80px
  }
  .product_image img {
	width:200px;
	box-shadow:5px 5px 15px rgba(0,0,0,.536);
	border-radius:10px
  }
  .inner_header_block {
	margin-left:250px
  }
  .fraghead-inner2 {
	display:flex;
	padding:1rem;
	background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));
	min-height:250px
  }
  .fragheadinner {
	min-height:200px
  }
  .bncolumns {
	columns:2
  }
}
@media(min-width:1000px) {
  .bncolumns {
	columns:3
  }
  .product_image {
	margin-top:-330px;
	display:inline-block;
	width:300px
  }
  .product_image img {
	width:300px;
	box-shadow:5px 5px 15px rgba(0,0,0,.536);
	border-radius:10px
  }
  .inner_header_block {
	margin-left:350px
  }
  .fraghead-inner2 {
	display:flex;
	padding:1rem;
	background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));
	min-height:350px
  }
  .fragheadinner {
	min-height:350px
  }
}
@media(min-width:1400px) {
  .product_image {
	margin-left:calc(50% - 700px);
	margin-bottom:30px
  }
}
.dir-desc {
  padding-right:20px
}

.dir-desc p {margin-bottom:20px;}
.fragnotes {
  order:1;
}
.peepsandcomps {
  order:2;

}
@media(max-width:600px) {

.fragnotes {
  order:1;
  width:100%;
}
.peepsandcomps {
  order:2;
  width:100%;

}
}

@media(min-width:500px) {
  .fragnotes {
	order:2
  }
  .peepsandcomps {
	order:1
  }
}








 .shoplisting {
    
    outline:#ddd 1px solid;
    border-radius:5px;
margin-bottom: 20px;
box-shadow: 5px 5px 5px rgba(127, 127, 127, 0.554);    
display: flex;
  }
  
  .shoplisting div {padding:4px;}
  .shoplisting h5 {margin:0;padding:0;font-size: smaller;font-weight: normal;text-decoration: none;color:black;
    
    overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 3; /* number of lines to show */
             line-clamp: 3; 
     -webkit-box-orient: vertical;
     
}
.pricecost {text-align: right;display:block;margin:5px;display:inline-block;background: magenta;color:white;border-radius: 5px;font-size:.8em;padding:2px;}
.shopflaf{height:14px;}
  .shopimagelisting {
width:100px;
height:100px;
margin-right: 5px;
  }
  



.shopcontainer{
  display:flex;flex-wrap:wrap;justify-content:space-around;
  
}
.shopcontainer .shoplisting {
  
  flex: 1 0 100%;
  margin-bottom:10px;
}

@media(min-width:600px) {

.shopcontainer .shoplisting {
  
  flex: 1 0 45%;
  margin:1%;  
}

}

@media(min-width:800px) {

.shopcontainer .shoplisting {
  
  flex: 1 0 30%;
  margin:1%;  
}

}


@media(min-width:1023px) {

.shopcontainer .shoplisting {
  
  flex: 1 0 100%;
  margin-bottom:10px;
}

}








@media(min-width:1023px) {
  .bnsidebaradbottom {
	position:sticky;
	top:20px
  }
  .toppartoffragdir,
  .fragmiddle {
	flex-wrap:nowrap
  }
  .fragreviewouter {
	padding-right:10px
  }
  .fragshops {

  }
  
 
  .fragnotes {
	width:100%;
	padding:20px;
	color:#000;
	line-height:1.5em!important
  }
}
#all,
#fragrances,
#brands,
#people,
#tab5,
#tab6 {
  display:none;
  padding:10px;
  color:grey
}
input[value=all]:checked~#all {
  display:block
}
input[value=all]:checked~.ball {
  text-decoration:underline;
  text-decoration-color:#3aca08;
  text-decoration-thickness:2px
}
input[value=fragrances]:checked~#fragrances {
  display:block
}
input[value=fragrances]:checked~.bfragrances {
  text-decoration:underline;
  text-decoration-color:#3aca08;
  text-decoration-thickness:2px
}
input[value=brands]:checked~#brands {
  display:block
}
input[value=brands]:checked~.bbrands {
  text-decoration:underline;
  text-decoration-color:#3aca08;
  text-decoration-thickness:2px
}
input[value=people]:checked~#people {
  display:block
}
input[value=people]:checked~.bpeople {
  text-decoration:underline;
  text-decoration-color:#3aca08;
  text-decoration-thickness:2px
}
input[value=tab5]:checked~#tab5 {
  display:block
}
input[value=tab6]:checked~#tab6 {
  display:block
}
@media(max-width:800px) {
  .hideifsmall {
	display:none
  }
}
@media(min-width:801px) {
  .hideifsmall {
	display:inline
  }
}
.pagination {
  margin-top:30px;
  margin-bottom:40px;
  background:#f4f4f4;
  display:flex;
  flex-direction:row;
  justify-content:space-between
}
.pagination_prev {
  flex:0 1 auto
}
.pagination_inner {
  flex:0 1 auto;
  text-align:center
}
.pagination_next {
  flex:0 1 auto;
  align-self:end
}
.pagination .pagnolink,
.pagination a {
  text-decoration:none;
  padding:10px;
  text-align:center;
  min-width:40px;
  margin:5px;
  display:inline-block
}
.pagination .pagnolink,
 {
  color:#000;
  font-weight:800
}
.pagination a {
  border:gray 1px solid;
  text-decoration:none;
  padding:10px;
  text-align:center;
  min-width:40px;
  margin:5px;
  display:inline-block;
  color:#595555;
  background:#eee
}


.xbn_cards {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:50px;
  margin-bottom:10px
}
.xbn_card {
  max-width:46%;
  display:flex;
  flex-direction: column;
  justify-content: space-between;
}

.numberrating{display: none;}
@media(min-width:500px) {
  .xbn_card {
	max-width:30%;
  }


}
@media(min-width:650px) {
  .xbn_card {
	max-width:22%;
  }
  

}
@media(min-width:800px) {
  .xbn_card {
	max-width:18%;
  }
  

}
@media(min-width:1016px) {
  .xbn_card {
	max-width:23%;
  }

}
@media(min-width:1266px) {
  .xbn_card {
	max-width:18%;
  }

}
@media(min-width:1386px) {
  .xbn_card {
	max-width:151px;
  }

  
  #wardresults .xbn_card {
	  maX-width:205px !important;
	  min-width:205px !important;

	}

  #wardresults .xbn_card .wardrobeadditionsdir {

padding: 10px;
}

  #wardresults.xbn_list .xbn_card {
	  max-width: none !important;
	
	}


}

	.wardrobeadditionsdir {
		align-self: flex-end;width: 100%;
		font-size: small;padding: 5px;
		color: black;
		/*background: lightgoldenrodyellow;*/
	}
	
	.wardrobeadditionsdir div {padding-bottom:5px; display: flex;justify-content: space-between;
}

.xbn_list .titleofdroveicon {display: none;}

.xbn_card {
  margin:7px;
  min-height:200px;
  background:#fff;
  outline:1px #d3d3d3 solid;
  text-decoration:none!important;
  -webkit-box-shadow:3px 3px 5px 0 #b0adb0;
  -moz-box-shadow:3px 3px 5px 0 #b0adb0;
  box-shadow:3px 3px 5px 0 #b0adb0
}
.xbn_card_data {
  padding:10px;
  color:gray;
  font-size:smaller;
/*  background: lightpink;*/
  min-height: 100px;
}
.xbn_cardtitle {
  padding-bottom:8px;
  color:#000;
  display:inline-block
}
.xbn_subtitle {
  padding-bottom:5px;
  color:gray;
  display:block
}
.xbn_card:hover {
  border:0;
  filter:brightness(98%);
  -webkit-box-shadow:none;
  -moz-box-shadow:none;
  box-shadow:none
}
.xbn_list {
  display:block!important;
  width: 100%;
}

.xbn_list .xbn_card:nth-child(odd)  {
  filter:brightness(95%);
}

.xbn_list 	.wardrobeadditionsdir {display: flex;
	width: 100%;justify-content: right;
	font-size: small;padding: 5px;
	
	/* background: rgba(200, 200, 187, 0.554);*/
	
	align-self: normal;
}

.listheader
{display: none;}


.xbn_list 	.wardrobeadditionsdir div {width: 100px;padding: 5px;}
.xbn_list 	.wardrobeadditionsdir .titleofdrove {display: none;}

@media(min-width:500px) {
  .xbn_list .xbn_card {
	display:flex;
	max-width:100%;
	height:auto;
	min-height:60px;
	box-shadow:none;
	margin:0;
	flex-direction: row;
	justify-content: normal;
  }
  .xbn_list .xbn_card_pic {
	width:60px;
	padding:5px
  }
  .xbn_list .xbn_cardtitle {
	display:block;
	padding:5px;
	width:200px;
	padding-left:10px
  }
  .xbn_list .xbn_subtitle {
	display:block;
	padding:5px;
	width:200px;
	color:#000;
	padding-left:10px
  }
  .xbn_list .xbn_card_data {
	display:flex;
	min-height: 0px;
  }
}

.xbn_list .bigno{text-align: center;}

.titleofdroveicon i,.titleofdroveicon {display: none;width: 0;}


@media(max-width:499px) {
	
	/*
	.xbn_list .xbn_card {
		display:flex;
		max-width:100%;
		height:auto;
		min-height:60px;
		box-shadow:none;
		margin:0;
		flex-direction: row;
		justify-content: normal;
	  }
	*/
	
}


@media(max-width:999px) {
  
#wardresults.xbn_list .xbn_card .xbn_card_pic {width: 30%;max-width: 70px;float: left;padding: 5px;}
#wardresults.xbn_list .xbn_card{width: 100%;display: block;max-width:100%;box-shadow: none;margin:0;min-height: 0;}
#wardresults.xbn_list 	.wardrobeadditionsdir .fa-star,#wardresults.xbn_list 	.wardrobeadditionsdir .fa-star-o {display: none;}
#wardresults.xbn_list 	.wardrobeadditionsdir .numberrating {display: inline-block;margin-left: auto;margin-right: auto;}
#wardresults.xbn_list 	.wardrobeadditionsdir {display: flex;justify-content: space-between}
#wardresults.xbn_list {display: block;width: 100%;}
#wardresults.xbn_list  .titleofdroveicon {display: inline-block;}
#wardresults.xbn_list 	.wardrobeadditionsdir div {width: auto;min-height: 0;}
#wardresults.xbn_list .xbn_card_data{width: auto;min-height: 0;}
}
#wardresults.xbn_list .listheader {font-weight: bold;background: #fff;padding: 0px;border-bottom: 3px solid black;  filter:brightness(100%);display: flex;
}


#search_form_bn {
  display:flex;
  justify-content:center;
  padding-bottom:50px
}
.radiobuttons_form_bn {
  color:#000;
  text-align:center;
  font-size:smaller
}
.radiobuttons_form_bn label {
  padding-right:10px
}
input[type=text],
input[type=button] {
  -webkit-appearance:none;
  -webkit-border-radius:0
}
.searchbox_bn {
  width:100%;
  position:relative;
  display:flex
}
.searchbar_bn {
  margin:0;
  width:100%;
  border:3px solid #3aca08;
  border-right:none;
  border-radius:5px 0 0 5px!important;
  outline:none
}
.searchbar_bn:focus {
  color:#380136
}
.searchbutton_bn {
  width:56px;
  height:56px;
  border:1px solid #3aca08;
  background:#3aca08;
  text-align:center;
  color:#fff;
  border-radius:0 5px 5px 0!important;
  cursor:pointer;
  font-size:20px;
  padding:5px
}
.searchwrap {
}
@media(min-width:800px) {
  .searchbutton_bn {
	width:150px
  }
}
.showall {
  text-align:center;
  color:#000;
  padding:15px;
  text-decoration:none;
  display:block;
  background:#eee
}
.bn_cards {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap
}
.bn_card_v,
.bn_card_hv,
.bn_cards_v .bn_card {
  flex-direction:column
}
.bn_card_h {
  flex-direction:row
}
.bn_card {
  background:#fff;
  display:flex;
  margin:10px;
  border-radius:10px
}
.bn_card:hover {
  text-decoration:none
}
.bn_cards_w_1 .bn_card {
  flex:100%
}
.bn_cards_w_2 .bn_card {
  flex:45%
}
.bn_cards_w_3 .bn_card {
  flex:31%
}
.bn_cards_w_4 .bn_card {
  flex:22%
}
.bn_card_image {
  filter:brightness(98%);
  background-color:#ccc;
  background-position:center;
  background-size:cover;
  border-top-left-radius:10px;
  border-bottom-left-radius:10px
}
.bn_card_h .bn_card_image {
  flex:33%
}
.bn_card_v .bn_card_image,
.bn_card_hv .bn_card_image,
.bn_cards_v .bn_card {
  min-height:160px;
  border-top-left-radius:10px;
  border-bottom-left-radius:0;
  border-top-right-radius:10px
}
.bn_card_text {
  margin-top:10px;
  font-size:1em;
  padding:10px
}
.bn_card_h .bn_card_text {
  flex:66%
}
.bn_card_meta ul,
.bn_card_meta ul li {
  list-style:none;
  margin:0;
  padding:0;
  font-size:smaller;
  padding-bottom:5px
}
.bn_card_meta ul {
  padding-bottom:5px
}
.bn_card_meta ul li {
  font-size:1em;
  color:gray;
  display:inline-block;
  margin-right:20px
}
.bn_card_text h3 {
  font-size:1.5em;
  padding:0;
  margin:0;
  padding-bottom:5px;
  font-weight:600;
  line-height:1.2em
}
.bn_card_blurb {
  font-size:1em
}
.smaller_card h3 {
  font-size:1.2em
}
.bn_cards_hero .bn_cards {
  display:block
}
.bn_cards_hero .bn_cards .bn_card {
  flex-direction:column;
  position:relative
}
.bn_cards_hero .bn_cards .bn_card_image {
  min-height:500px;
  border-radius:10px
}
.bn_cards_hero .bn_cards .bn_card_text {
  border-bottom-left-radius:10px;
  border-bottom-right-radius:10px;
  border-top-right-radius:0;
  position:absolute;
  bottom:0;
  right:0;
  text-align:right;
  padding:10px;
  z-index:100;
  color:#fff;
  height:auto;
  background:rgba(0,0,0,.6)
}
.bn_cards_hero .bn_cards .bn_card_blurb {
  display:none
}
.bn_cards_hero .bn_cards .bn_card_text h3 {
  text-align:right;
  font-size:2.8em;
  border-radius:5px
}
.morethings {
  display:block;
  text-align:right;
  color:#000;
  padding:10px;
  text-decoration:none
}
.bn_cards_nodesc .bn_card .bn_card_text .bn_card_blurb {
  display:none
}
.bn_card_i_200 .bn_card_v .bn_card_image {
  min-height:200px
}
@media screen and (min-width:601px) {
  .bn_card_hv {
	flex-direction:row
  }
  .bn_card_hv .bn_card_image {
	border-top-left-radius:10px;
	border-bottom-left-radius:10px;
	border-top-right-radius:0;
	flex:33%
  }
  .bn_card_hv .bn_card_text {
	flex:66%
  }
}
@media screen and (max-width:600px) {
  .bn_cards_w_2 .bn_card {
	flex:100%
  }
  .bn_card_blurb {
	display:none
  }
  .bn_cards_hero .bn_cards .bn_card_text h3 {
	font-size:1.2em
  }
  .bn_card_text h3 {
	font-size:1em
  }
  .smaller_card h3 {
	font-size:smaller
  }
  .bn_card_smaller .bn_card_meta {
	display:none
  }
  .bn_cards_hero .bn_cards .bn_card_image {
	min-height:300px
  }
}
.bn_cards_overflow {
  overflow:scroll;
  flex-wrap:nowrap;
  min-width:210px
}
.bn_cards_overflow .bn_card_image {
  min-width:175px;
  max-height:150px
}
.bn_cards_section h2 {
  text-align:center;
  text-decoration:underline;
  text-decoration-color:#3aca08;
  text-decoration-thickness:5px;
  text-decoration-skip-ink:none
}
.tiny_card h3 {
  font-size:12px
}
.tiny_card {
  width:130px
}
.tiny_card .bn_card_image {
  min-height:130px;
  min-width:130px!important
}
h1.h1_bnfrag {
  font-size:2.2em;
  line-height:.9em;
  margin:0;
  margin-top:14px
}
.h1_fragname {
  text-shadow:5px 5px #000;
  color:#fff
}
.h1_gender {
  font-size:.8em;
  text-shadow:3px 3px #000
}
.h1_house {
  display:block;
  margin-top:-5px;
  font-size:.5em;
  color:#fff;
  text-shadow:2px 2px #000;
  font-weight:300
}
.h1_house a {
  color:#fff;
  text-decoration:none
}
@media screen and (min-width:1000px) {
  h1.h1_bnfrag {
	font-size:3.2em;
	line-height:.9em;
	margin:0;
	margin-top:35px
  }
  .h1_fragname {
	text-shadow:5px 5px #000;
	color:#fff
  }
  .h1_gender {
	font-size:.8em;
	text-shadow:3px 3px #000
  }
  .h1_house {
	display:block;
	margin-top:-12px;
	font-size:.5em;
	color:#fff;
	text-shadow:2px 2px #000;
	font-weight:300
  }
  .h1_house a {
	color:#fff;
	text-decoration:none
  }
}
.bntopdeets span,
.bntopdeets span a {
  font-size:smaller;
  color:#fff;
  text-decoration:none
}
@media(min-width:49em) and (max-width:1010px) {
  .hiddenmenuitems {
	display:none
  }
}
@media(max-width:49em) {
  .dropdownforhiddens {
	display:none
  }
}
@media(min-width:1010px) {
  .dropdownforhiddens {
	display:none
  }
}


  #theselector,#thesort, #theascdesc{
    border-radius:6px;
    display:inline-flex;
    outline: lightgray 1px solid;
    margin-right: 5px;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.464);
  }
  
  .outer-left {
     border-radius : 6px 0 0 6px;
  }
  
  .outer-right {
    border-radius : 0 6px 6px 0; 
  }
  
  #theselector div,#theascdesc div {padding:10px;cursor: pointer;background: white;  color:#3aca08;background: rgb(255, 255, 255);
}
.dropdownlist {box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.464);}
.dropdownlist ul li a {font-size: smaller;padding: 10px;display: block;border-bottom: 1px solid lavender;text-decoration: none;color:black;}
.dropdownlist ul li a:hover {color: white;background: #00F700;border-radius:6px}
#theselector div:hover, #theascdesc div:hover {background: #00F700;color:white;}
.dropdownlist{display: none;}
.dropdownlist.showddl{display: block;}
.bncardview {display: none;}
.bnshowcardsel .bncardview {display: block;}
.bnshowcardsel .bnlistview {display: none;}
.dirsearchbar {display: flex;justify-content:space-between;}


  
  #livesearch {display: flex;flex-wrap: wrap;justify-content: left;}
  #livesearch label {flex:130px;margin: 10px;max-width: 130px}
  #livesearch label span {background: white;border-radius:10px;padding: 10px;display: inline-block;min-height: 180px;font-size: small;text-align: center;}
  #livesearch label img {border-radius:10px;}
  #livesearch label span:hover {background: lightgray;}
  
  #livesearch  [type=radio]{display: none;}
  
  #livesearch  [type=radio]:checked + span {
    background: rgba(88, 255, 0, 1);
    border-radius:10px;
  
    }
  
  
  .select2-container, .select2-dropdown, .select2-search, .select2-results {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    }
  
  .select2-container--default .select2-selection--multiple .select2-selection__choice {
    
    color:black;
    background: white;
    border:#aaa 1px solid;
    
  }
.bnform	input, .bnform textarea {
      font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen-Sans,Ubuntu,Cantarell,helvetica neue,sans-serif;
      font-size: 1em;
      padding: 0;
      border: 0;
      border-bottom-width: 0px;
      border-bottom-style: none;
      border-bottom-color: black;
      border-bottom: 1px solid transparent;
      outline: ;
      margin-top: 10px;
      background: #f6f6f6;
    }

#bnform{
  
  
  transition: all 3s;
}
    
.bnform		select,input[type=text],textarea,input[type=number],input[type=url],input[type=email] {
      width:100%;
      height:auto;
      margin:0;
      background:white;
    }
.bnform	input[type=text],.bnform textarea,.bnform input[type=number],.bnform input[type=url],.bnform input[type=email] {
    margin:0;
    padding: 5px;
    outline:#aaa 1px solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
     border-radius: 5px;
  }
  
  .bnform fieldset {border-top:deeppink 3px solid;padding-top: 30px;margin-bottom: 20px;margin-top: 20px;}
.bnform legend {font-weight: bold;font-size: 1.3em;background: deeppink;color:white;padding: 5px;border-radius: 5px;}	
  
  .bnform	input[type=submit]
  {width:100%;padding:5px;font-size: large;border-radius: 5px;color:black;background: lime;box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.52);}

  .bnform	input[type=submit]:hover
  {width:100%;padding:5px;font-size: large;border-radius: 5px;color:black;background: rgb(137, 247, 137);box-shadow: none;}


.bnform	select{
  height: 30px;
    outline:#aaa 1px solid;
  color: black;
  background-color: white;
  border-radius: 5px;
  box-shadow: 0px 0px;}

  .adminmain {background: rgba(255, 255, 255, 0.735);width: 100%;}
  .select2-container {width: 100% !important;}
  .form_sociallink {display: flex;flex:40% !important;}
  .form_sociallink label img {margin:3px;padding: 3px;width:32px;}
  .form_sociallink label {margin-right: 5px;}

.bnform .formrow {display: flex;padding:10px;}
.bnform .formrow .formlabel {flex:160px;text-align: right;padding-right: 10px;padding-top: 5px;min-width: 160px;}
.bnform .formrow .formfield {flex:100%;}
.bnform .formrowsplit {display: flex;}
.bnform .formrowsplit>div {flex: 40%;}
.form_sociallink {margin-right:15px;margin-bottom: 5px; padding:5px;}

.hideform{  height: 0;
    opacity: 0;
    overflow: hidden;}

input:optional {
  border-color: #aaa;
}

input:invalid {
  border-color: red;
  background-color: lightpink;
}
.trumbowyg-box{min-height: 0px;}
.trumbowyg-editor-box {background:rgba(255, 255, 255, 0.528);}
.trumbowyg-editor p {margin-bottom:1em;}
.trumbowyg-editor{background: white;}
input:required {
  border-color: black;
  background-color: lightgoldenrodyellow;
}

input:read-only {
  border-color: black;
  border:none;
  background-color:rgba(255, 255, 255, 0.082);
}

.errorform
{
  
background: rgba(255, 255, 0, 0.522);	
margin-bottom:3px;
color:black;
}
.diffs del{
  
background: lightpink;
color:red;	
}
.diffs ins{
  
background: palegreen;
color:green;	
}

li.app-add,li.app-change,li.app-remove,li.app-check{
  
  padding:15px;
  border-radius:5px;
  margin-bottom: 5px;

}

li.app-add{	background: lightgreen;}
li.app-add::before{content: '🆕 ';}
li.app-change{	background: palegoldenrod;}
li.app-change::before{	content: '🦋 ';}
li.app-remove{	background: lightpink;}
li.app-remove::before{	content: '🗑️ ';}
li.app-check{	background: paleturquoise;}
li.app-check::before{	content: '⚠️ ';}

.app-amend {background: rgba(255, 255, 255, 0.506);padding:2px;border-radius:5px;display: inline-block;}



.bn-likeButton {
  border-radius:5px;
    background-color: rgba(0, 0, 0, 0.141);
    color: rgb(0, 0, 0);
    border: none;
    padding: 8px 16px;
    cursor: pointer;
    transition: background-color 0.3s ease; /* Added transition property */
}


.bn-likeButton:hover {
    background-color: lime;
}

.bn-likeButton.bn-liked {
    background-color: white;
}

.bn-likeButton.bn-liked::first-letter
 {
    color: red;
}


.bn-likeButton.bn-liked:hover {
    background-color: rgba(0, 0, 0, 0.141);
    transition: opacity 0.3s ease; /* Added transition property */
    }
    
   

.bn-likeCount {
    margin-left: 10px;
    font-weight: bold;
}



/*reviews*/
.fragrate3 {
  background:rgba(226,240,226,.752)
}
.fragrate1 {
  background:rgba(240,226,226,.752)
}
.fragrate2 {
  background:rgba(240,238,226,.752)
}

.fragreviewer {
  text-align:left;
  padding:10px;
  display: flex;
  flex-direction: row;
}


.fragreviewrow{
  
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.fragreviewrow>.fragreviewer{
  flex: 0 0 50%; /* Each of the first two divs takes up 50% of the space */
  order:1;
}

.fragreviewrow>.fragreview{
  flex-basis: 100%; /* The third div takes up 100% of the space */
  order:3;

}

.fragreviewrow>.fragreview>h3{

margin-top:0;

}

.fragreviewrow>.reviewrating{
  flex: 0 0 50%; /* Each of the first two divs takes up 50% of the space */
  order:2;
text-align: right;
}

.fragreviewrow>.reviewrating img{
padding: 10px;
width: 100px;
}

.fragreviewouter {
  border-radius:15px;
  margin-bottom:40px
}



.fragreviewfooter {
  
  font-size:small;
  padding:30px 0 0 10px;
  display:flex;
  align-items:center;

}

.fragreviewfooter div{padding: 10px;
}

.likerevbut {
  flex-grow: 1; /* Take up the remaining space */
flex-shrink: 0; /* Do not shrink this item */

text-align: right;
}


.fragreview {
  line-height:1.8em;
  padding:10px;
  padding-left:20px;
  padding-top:20px;
  color: black;
  overflow-wrap: break-word; /* Breaks long words at boundaries */
  word-break: break-word; /* Fallback for older browsers */
  hyphens: auto; /* Adds hyphens when breaking words (optional) */

}


.fragreviewer a img {
  width:100px;
  border-radius: 15px;
  padding:10px 10px 10px 10px;

}
.fragreviewer a {
  color:#000;
  text-decoration:none;
  font-weight:700;
  /*padding:10px 0 10px 0;*/
}
.fragreviewer a span{
  color:rgba(0, 0, 0, 0.768);
  text-decoration:none;
  font-weight:normal;
  font-size: smaller;
}

  .reviewtoplinks {display:flex;justify-content: center;padding-bottom: 20px;}
.reviewtoplinks li {display: inline-block; flex: 0 0 24%;text-align: center;}
.reviewtoplinks li a {color:black;text-decoration: none;font-size: 0.7em;}
.reviewtoplinks li i {display:block;font-size: 1.5em;}



@media(min-width:49em) {

  .reviewtoplinks {display:flex;justify-content: right;padding-bottom: 20px;}
.reviewtoplinks li {display: inline-block;text-align: right;flex: 0 0 auto;padding-left: 20px;}
.reviewtoplinks li a {color:black;text-decoration: none;font-size: 1em}
.reviewtoplinks li i {display:inline;font-size: 1em}


.fragreviewfooter {
  
  padding:30px 0 0 170px;

}


.fragreviewouter{
  margin-left:20px;

  
}
.fragreviewer {
  text-align:center;
  padding:10px;
  display: flex;
  flex-direction: column;
}

.fragreviewrow{
  display:flex;
  flex-direction: row;
  flex-wrap: no-wrap;
}

.fragreviewrow>.fragreviewer{
  flex: 0 0 160px; /* Each of the first two divs takes up 50% of the space */
  order:1;
}

.fragreviewrow>.fragreview{
  flex-grow: 1; /* Take up the remaining space */
flex-shrink: 0; /* Do not shrink this item */
flex-basis: 0;
  order:2;

}

.fragreviewrow>.reviewrating{
  flex: 0 0 120px; /* Each of the first two divs takes up 50% of the space */
  order:3;
  min-width: 120px;

}
}
.faqlist {background: #efe;padding:20px;margin-bottom: 20px;border-radius: 10px;list-style: disc;padding-left: 20px;}
.faqlist li {margin-left: 20px;padding-bottom: 10px;}
.faqlist li a {text-decoration: none;color: black;}
.bnfaqs{margin-left: 30px;line-height:1.8em;color:black;max-width: 800px;}
.bnfaqs h3{color: black;font-size: 1.2em;margin: 0;padding: 0;padding:10px 0 20px 0;}
.faqanswer {background: #ffe;padding:20px;margin-bottom: 20px;border-radius: 10px;}


/*tags*/


.taggle_list {
  float: left;
  padding: 0;
  margin: 0;
  width: 100%;
}

.taggle_input {
  display:block;
  border: 1px solid #000;
  background: #eee;
  outline: none;
  min-width: 350px;
  padding: 8px;
  padding-left: 0;
  width: 100%;
  max-width: 100%;
}

.taggle_list li {
  float: left;
  display: inline-block;
  white-space: nowrap;
  font-weight: 500;
  margin-bottom: 5px;
}

.taggle_list .taggle {
  margin-right: 8px;
  background: #E2E1DF;
  padding: 5px 10px;
  border-radius: 3px;
  position: relative;
  cursor: pointer;
  transition: all .3s;
  -webkit-animation-duration: 1s;
      animation-duration: 1s;
  -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
}

.taggle_list .taggle_hot {
  background: #cac8c4;
}

.taggle_list .taggle .close {
  font-size: 1.1rem;
  position: absolute;
  top: 10px;
  right: 3px;
  text-decoration: none;
  padding: 0;
  line-height: 0.5;
  color: #ccc;
  color: rgba(0, 0, 0, 0.2);
  padding-bottom: 4px;
  display: none;
  border: 0;
  background: none;
  cursor: pointer;
}

.taggle_list .taggle:hover {
  padding: 5px;
  padding-right: 15px;
  background: #ccc;
  transition: all .3s;
}

.taggle_list .taggle:hover > .close {
  display: block;
}

.taggle_list .taggle .close:hover {
  color: #990033;
}

.taggle_placeholder {
  position: absolute;
  color: #CCC;
  top: 12px;
  left: 8px;
  transition: opacity, .25s;
  -webkit-user-select: none;
   -moz-user-select: none;
    -ms-user-select: none;
      user-select: none;
}

.taggle_sizer {
  padding: 0;
  margin: 0;
  position: absolute;
  top: -500px;
  z-index: -1;
  visibility: hidden;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
  -webkit-transform: translateY(0); }
  40% {
  -webkit-transform: translateY(-16px); }
  60% {
  -webkit-transform: translateY(-7px); } }

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
  -webkit-transform: translateY(0);
      transform: translateY(0); }
  40% {
  -webkit-transform: translateY(-16px);
      transform: translateY(-16px); }
  60% {
  -webkit-transform: translateY(-7px);
      transform: translateY(-7px); } }

.bounce {
  -webkit-animation-name: bounce;
      animation-name: bounce; }
      
      
      
 