/* Amazing Search CSS : kosso */

.siteHeaderLogo{
  float:left;width:320px;margin-top:30px;
}

.siteHeaderLogo h2{
  font-style:italic;color:#ec8328;margin-top:-3px;
}

.siteHeaderLogo a{
  background:url( /images/logoSearch.svg ),no-repeat left,-8px;
  background-size:100% 100%;
  text-indent:-999em;
  display:block;
  height:39px;
  width:238px;
}

#searchBar{
  width:940px;
  margin:auto;
  background-color:#fff;
}

#searchBox{
  width:100%;
  height: auto !important; /* lock/override old amazingtunes.com searchBox CSS */
}

input.es_index{
  margin-left:14px !important;
}

form.search{
  width:100%;
    margin: 0px;
    padding:0px;
}

form.search input{
  margin-left:0px;
}

form#search{
  display:inline-block;
  z-index:20;
  padding:0px;
  margin:0px;
  width:100%;
  height: auto !important;  /* lock/override old amazingtunes.com searchBox CSS */
  border: 0 !important;     /* lock/override old amazingtunes.com searchBox CSS */
}

form#search input {
  padding: 0px;
  margin:0px;
}

form#search div#search-input
{
  height:20px;
  border:1px solid #d4d4d4;
}

form#search input[type=text]{
  font-size:16px;
  color:#a9a9a9;
  width: 90%;
  border:0px;
  background:transparent;
  margin: 0px;
  outline: none;
}

input#searchsubmit{
  outline:none;
  margin-top: 0px !important; /* lock/override old amazingtunes.com searchBox CSS */
}

/* the dummy input field for the search box hinted text */
form#search input.tt-hint{
  top:0px !important;  /*couldnt see where this is being overidden. so !important */
  color:#ccc !important;
  height: auto !important;  /* lock/override old amazingtunes.com searchBox CSS */

}

/*advanced checkboxes */
div#search_advanced
{
  overflow:hidden;
  float:right;
  margin:12px 0px;
  display: none;
}

form#search div#search_advanced input[type=checkbox], form#search div#search_advanced label
{
  float:left;
}

form#search div#search_advanced label
{
  margin:0px 0px 0px 4px;
  color:#888;
  font-size:11px;
}


/* auto complete drop-down */
.tt-dropdown-menu {
  width: 100%;
  margin-top: 15px;
  margin-left: -12px;
  margin-right: 0px;
  padding: 0px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
}

.tt-suggestion {
  padding: 8px 0px;
  padding-left: 10px;
  font-size: 16px;
  line-height: 17px;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #333;
}

.tt-suggestion p {
  margin: 0px;
  padding: 0px;
}

.tt-hint{
  color:#555 !important;
}

.tt-dataset-q{
  margin-top:5px;
  margin-bottom:5px;
}

input.radio_btn{
  float: none;
}

.twitter-typeahead{
  z-index: 99;
  
  background: transparent;
  padding: 0px;
  width: 90%;
}

#search-input{
  margin:0px;  
  padding:0px;
  padding: 10px;
  text-align: left;
}

#search-input .empty-message {
  padding: 5px 10px;
  background: yellow;
  text-align: left;
}

.payload_index{
  font-style: italic;
  float:right;
  font-size: 10px;
  color: #ccc;
}

.btn_search{
  outline: none;
}

.btn-bar{
  margin-top: 10px;  
  float: right;
  margin-bottom: 10px;
}

.icon-button {
  display: inline-block;
  font-size: 34px;
  cursor: pointer;
}

/* amazingtunes tune play/pause icons */
.at-tune-play > .icon-play-circle{
  color: #8dc32f;
}
.at-tune-play > .icon-pause{
  color: #8dc32f;
}
.at-tune-play > .icon-pause-circle{
  color: #8dc32f;
}
.at-tune-play > .icon-circle{
  color: #8dc32f;
}
.at-tune-play > .icon-circle-o-notch{
  color: #bbbbbb;
}

/* ourstage tune play/pause icons */
.os-tune-play > .icon-play-circle{
  color: #ed174f;
}
.os-tune-play > .icon-pause{
  color: #ed174f;
}
.os-tune-play > .icon-pause-circle{
  color: #ed174f;
}
.os-tune-play > .icon-circle{
  color: #ed174f;
}
.os-tune-play > .icon-circle-o-notch{
  color: #cccccc;
}

.icon-heart-empty{
  color: #a2452a;
}
.icon-heart{
  color: #a2452a;
}
.icon-info-circled{
  color: #777;
}
.icon-plus-circled{
  color: #636186;
}

h2.search_results_header{
  font-weight:normal !important;
  padding-top:16px;
  margin-top:0px;
  margin-bottom:16px;
  letter-spacing:0px !important;
}

ul#results_list{
  padding-left: 0px;
  margin-left: 0px;
}

ul#results_list li{
  padding:5px 5px 5px 0px;
}

li.result_item{
  position:relative;
  list-style-type:none;
  min-height:90px;
  border-bottom:1px dashed #ddd;
}

li.result_item:last-child
{
  border:none;
}

/* type */
h5.result_type{
  font-weight:normal;
  color: #bbb;
  margin-left:90px;
  margin-bottom:0px;
  margin-top:4px;
}

h5.result_display_date{
  font-size:12px;
  line-height:1;
  font-weight: normal;
  color:#aaa;
  margin:6px 0px 6px 90px;
}

/* excerpt */
li.result_item p{
  font-size: 14px;
  margin-top: 5px;
  margin-left: 90px;
  margin-bottom: 5px;
}
/* image */
li.result_item img{
  float:left;
  width:80px;
  height:80px;
  margin-top:4px;
}

/* title */
li.result_item h4{
  font-size:16px;
  margin-left:89px;
  margin-bottom:0px;
  margin-top:2px;
  font-weight:bold;
  font-size:18px;
}

h5.index_display_name{
  margin:0px;
  text-align:right;
  font-size:10px;
  font-style:italic;
  color:#bbb;
}

.result_artist{
  margin-top:2px !important;
  margin-bottom:5px !important;
  margin-left:89px;
  
}
.result_title{
  padding-top: 0px !important;  
  font-size: 16px !important;
  color: #555 !important;
  font-style: italic;
  font-weight: normal !important;
}

.result_post_title{
  padding-top: 0px !important;  
  font-size: 16px !important;
}


/* maybe do this if we use each text for ink to artist/tune/etc. Currently the whole li links to the search result. */
/*
.result_title:hover{
  text-decoration: underline;
}
.result_artist:hover{
  text-decoration: underline;
}
*/

li.load_more{
  list-style-type: none;  
  font-weight:bold;
  font-size: 28px;
  cursor:pointer;
  margin-left:10px;
  margin-top:10px;  
  padding:15px !important;
  background-color: #eee;
}
li.load_more:hover{
  background-color: #e9790c;
  color: white;
}

/*
.suggestion_amazingtunes{
  background-color: red;
}
.suggestion_kossotunes{
  background-color: blue;
}
.suggestion_ourstage{
  background-color: green;
}
*/

/* suggeestions 
.tt-dataset-q p.suggestion_kossotunes{
  background: green;
}
*/

/* for spinning things : just add/remove the className 'spinner' ; */
@-webkit-keyframes webkit-anim-rotate {
  0% {
    transform: rotate(0);
    -webkit-transform: rotate(0);
  }
  100% {
    transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
  }
}
@-moz-keyframes moz-anim-rotate {
  0% {
    -moz-transform: rotate(0);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-ms-keyframes ms-anim-rotate {
  0% {
    -ms-transform: rotate(0);
  }
  100% {
    -ms-transform: rotate(359deg);
  }
}
@-o-keyframes o-anim-rotate {
  0% {
    -o-transform: rotate(0);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@keyframes anim-rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(359deg);
  }
}

.spinner {
    -webkit-animation: webkit-anim-rotate 3s infinite linear;
    -moz-animation: moz-anim-rotate 3s infinite linear;
    -ms-animation: ms-anim-rotate 3s infinite linear;
    -o-animation: o-anim-rotate 3s infinite linear;
    animation: anim-rotate 3s infinite linear;
}