:root {
  --shadow-color: 0deg 0% 63%;
  --search-shadow:
    0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.36),
    0.8px 1.6px 2px -0.8px hsl(var(--shadow-color) / 0.36),
    2.1px 4.1px 5.2px -1.7px hsl(var(--shadow-color) / 0.36),
    5px 10px 12.6px -2.5px hsl(var(--shadow-color) / 0.36);
}

@media (max-width: 601px) {
  .imageBoxMed {
    height: 300px;
  }
  
  .galBoxMed {
	height: 370px;
	width: 340px;
  }
}

@media (min-width: 601px) {
  .imageBoxMed {
    height:200px;
  }
  .imageBoxSmall {
    height:180px;
  }  
  .galBoxMed {
	height: 170px;
	width: 140px;
  }
}

@media screen and (min-width: 601px) {
    .desktopSmallBox {
      width: 150px;
      height: 150px;
    }
}

.polaroid {
	display: block; 
	margin: auto; 
	background: #fff; 
	border: solid 1px #EFEFEF; 
	padding: 5px; 
	box-shadow: 2px 2px 12px silver
}

.blueBB {
	border: 3px solid #092b5f; 
	border-radius: 15px; 
	background: #828fb0; 
	padding: 10px; 
	width: 100%
}

a {
	text-decoration: none;
}

#tcontent a {
	color: var(--primarylightcolor) ;
  font-weight: bold ;
}

#login-str a {
	color: var(--primarylightcolor) ;
  font-weight: bold ;
}

.textindent {
	margin-left: 4px;
	margin-right: 4px;
}

.bidinfo {
	width: 160px;
	text-align: right;
	float: left;
	clear: left;
	margin-right: 10px
}

.footlink {
	font-size: small;
}

.footlink a {
	text-decoration: none ;
}

.footlink a:hover {
	text-decoration: underline ;
}

.graygrad {
	color: #e9e9e9;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
	background: -moz-linear-gradient(top,  #888,  #575757);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}

.whitegrad {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}

.toplink { 
	display: inline-block;
	text-align: center;
	border: solid 1px #555;

	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);	
	
	-webkit-border-radius: .5em; 
	-moz-border-radius: .5em;
	border-radius: .5em;
}

.toplink div {
	width: 85px;
	height: 25px; 
	float: left;
	color: #e9e9e9;
}

.toplink a {
	color: #e9e9e9;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);	
	text-decoration: none;
	font: 14px/100% Verdana, Arial, Helvetica, sans-serif;
}

.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

.centerPic {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
}

.topmenu {
    box-sizing: border-box;
    border-top: 4px solid var(--bordercolor)!important ;
    border-bottom: 4px solid var(--bordercolor)!important ;
    background-color: var(--bordercolor) ;
  }
  
  .topmenu:hover {
    border-top: 4px solid var(--backcolor)!important ;
    border-bottom: 4px solid var(--primarycolor)!important ;
    background-color: var(--backcolor) ;
  }
  
  @media (max-width:430px) {
    .aw-hide-small{display:none!important}
    .aw-similar-container{width:320px; height: 320px}
    .aw-similar-name { margin-top: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: bold; font-size: 16px; text-align: center; width: 320px}
    .aw-similar-grid  { display: grid; justify-content: space-around; grid-template-columns: repeat(auto-fill, 320px ); row-gap: 10px } 
    .searchinput-selected { color: var(--copycolor)!important }
  }
  @media (min-width:430px) and (max-width:650px) {
    .aw-hide-medium{display:none!important}
    .aw-similar-container{width:135px; height: 135px}
    .aw-similar-name { margin-top: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: bold; font-size: 13px; text-align: center; width: 135px}
    .aw-similar-grid  { display: grid; justify-content: space-around; grid-template-columns: repeat(auto-fill, 135px ); row-gap: 10px } 
    .searchinput-selected { color: var(--secdarkcolor)!important; font-weight: bold!important }
  }
  @media (min-width:650px) {
    .aw-hide-large{display:none!important}
    .aw-similar-container{width:135px; height: 135px}
    .aw-similar-name { margin-top: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: bold; font-size: 13px; text-align: center; width: 135px}
    .aw-similar-grid  { display: grid; justify-content: space-around; grid-template-columns: repeat(auto-fill, 135px ); row-gap: 10px } 
    .searchinput-selected { color: var(--secdarkcolor)!important; font-weight: bold!important }
  }
  
  .aw-small { font-size: 13px}
  .aw-menu-item { float: left; padding: 2px 10px 2px 10px; height: 100%; cursor: pointer}
  .aw-menu-item2:hover { background-color:var(--copylightercolor)!important; color: var(--copycolor)!important}
  .aw-side-menu-hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  }
  .aw-hover-link { font-weight: bold; color: var(--copycolor)}
  .aw-hover-link:hover { color: var(--copylightercolor)}
  .aw-verticalcenter { height: 100%; display: flex; align-items: center }
  
  .aw-dropdown-menu { position: relative}
  .aw-dropdown-content {position: absolute; border: 1px solid var(--bordercolor); background-color: var(--contentcolor); border-radius: 5px; box-shadow: var(--search-shadow); display: none; z-index: 1; }
  .aw-dropdown-item { font-weight: bold; color: var(--copycolor); padding: 4px 5px 4px 10px; font-size: 14px; width: 100%; cursor: pointer}
  .aw-dropdown-item:hover { background-color: var(--bordercolor) }
  .aw-ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
  .aw-timetrack { float: right; font-size: 13px; color: var(--successcontentcolor);margin-top: 10px; margin-right: 12px; margin-left:12px; font-weight: bold }
  
  .aw-mmenu-item { padding: 6px 5px; font-size: 16px; font-weight: bold; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer}
  .aw-mmenu-item:hover { background-color: var(--backcolor) }
  
  .searchinput-suggestions { border: 1px solid var(--bordercolor); background: var(--contentcolor); overflow: hidden; margin-top: 4px; display: none; border-radius: 5px; box-shadow: var(--search-shadow); position: absolute; float: left }
  .searchinput-suggestion { padding: 5px 5px; font-size: 14px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer}
  .searchinput-suggestion:hover { background-color: var(--backcolor) }
  .searchinput-suggestion-instruct { color: var(--secdarkcolor); font-weight: bold; margin-left: 8px; font-size: 14px; text-align: justify; text-justify: inter-word; }
  .searchinput-pastsearch { padding: 5px 5px; font-size: 14px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer}
  .searchinput-pastsearch:hover { background-color: var(--backcolor) }
  .searchinput-imagepane { width: 100%; margin-right: 8px; width: 364px; height: 580px; float: left; border-left: 3px solid var(--bordercolor) }
  .searchinput-suggestpane { width: 100%; padding-left: 4px; padding-right: 6px; float: left; height: 100% }
  .searchinput-value { margin-left: 4px }
  .searchinput-normal { color: var(--copycolor); font-weight: normal }
  .searchinput-imagepane-header-container { display: flex; justify-content: flex-end; width: 100%; margin-bottom: 14px; font-size: 14px;}
  .searchinput-imagepane-header { font-weight: bold; color: var(--copycolor); text-align: right; padding-bottom: 2px; margin-right: 14px; margin-top: 8px; border-bottom: 1px solid var(--copylightercolor) }
  .searchinput-imagepane-close { font-weight: bold; color: var(--primarydark); padding-bottom: 2px; margin-top: 8px; cursor: pointer }
  .searchinput-suggestion-header { font-weight: bold; margin: 8px 0 8px 2px; font-size: 14px; padding-bottom: 2px }
  .searchinput-wantlist { font-size: 14px; margin-top: 14px; margin-right: 14px; margin-left: 14px; text-align: justify; text-justify: inter-word; }
  .search-addwantbutton { margin-top: 10px; background-color: var(--primarycolor); border-radius: 5px; border: none; color: #FFFFFF; padding: 6px;}
  .search-addwantbutton:hover { background-color: var(--primarylightcolor)}
  .search-seemorebutton { margin-bottom: 12px; background-color: var(--primarycolor); border-radius: 5px; border: none; color: var(--forecolor); padding: 6px 12px 6px 12px; cursor: pointer}
  .search-seemorebutton:hover { background-color: var(--primarylightcolor)}

.aw-proofbar-container { display: grid; justify-content: space-around; justify-items: center; align-items: center; grid-template-columns: repeat(auto-fill, 80px ); gap: 5px}
.aw-proofbar-container img { max-width: 80px; max-height: 80px; box-shadow: var(--search-shadow); transition: all 0.5s ease-in-out; }
.aw-proofbar-container img:hover {  transform:scale(4); }

.aw-primary-button { margin-bottom: 12px; background-color: var(--primarycolor); border-radius: 5px; border: none; color: var(--forecolor); padding: 6px 12px 6px 12px;}
.aw-primary-button:hover { background-color: var(--primarylightcolor)}

.aw-filter-header { background-color: var(--backcolor); border: 2px solid var(--bordercolor); padding: 2px 10px 2px 10px; margin-bottom: 5px; border-radius: 5px; color: var(--copycolor); font-weight: bold; text-wrap: nowrap }
.aw-filter-body { margin-top: 0; border-radius: 5px }

  .primarybutton { margin-bottom: 12px; background-color: var(--primarycolor); border-radius: 5px; border: none; color: var(--forecolor); padding: 6px 12px 6px 12px; cursor: pointer}
  .primarybutton:hover { background-color: var(--primarylightcolor)}

div.searchinput-box {
    float: left ;
    margin-left: 20px;
    margin-bottom: 14px;
}

div.searchinput-wantlist {
    margin: 14px ;
    font-size: 14px;
}

div.searchinput-gallery {
    width: 150px;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative ;
}
  
div.searchinput-gallery img {
    box-shadow: var(--search-shadow) ;
    position: relative ;
}

div.aw-search-action {
    margin-top: 12px;
    margin-bottom: 8px;
    min-width: 0 ; 
  }
  
  div.searchinput-desc {
    font-size: 11px;
    max-width: 124px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: bold;
    text-align: left ;    
  }
  
  div.searchinput-source {
    font-size: 11px;
    overflow: hidden;
    white-space: nowrap;
    font-weight: normal; 
    text-align: left ;   
  }
  
  div.searchgallery-desc {
    font-size: 11px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: bold;
    text-align: center ;
    margin-bottom: 8px;
    padding-right: 8px;
  }
  
  div.searchgallery-source {
    overflow: hidden;
    white-space: nowrap;
    font-weight: normal; 
    text-align: center ;   
  }

.clear-input-container {
	position: relative;
	display: inline-block;
}
  
.clear-input-button {
	/* button position */
	position: absolute;
	right: 4px;
	top: 12px;
	bottom: 0;
	/* button appearane */
	justify-content: center;
	align-items: center;
	width: 16px;
	height: 16px;
	appearance: none;
	border: none;
	border-radius: 50%;
	background: gray;
	margin: 0;
	padding: 2px;
	color: white;
	font-size: 13px;
	cursor: pointer;
	/* hide the button initially */
	display: none;
}
  
.clear-input-button:hover {
	background: darkgray;
}
  
.clear-input--touched:focus + .clear-input-button,
.clear-input--touched:hover + .clear-input-button,
.clear-input--touched + .clear-input-button:hover {
	display: inline-flex;
}