body, html{
  height: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  font-family: 'Open Sans', sans-serif;
  background-color: #F8F8F8;
}

.wrapper {
  height: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
}

.feature {
  /*padding: 30px 20px;*/
  font-size: 130%;
  color: #EDEFF0;
  /*font-family: 'Raleway', sans-serif;*/
}

.light-font {
  /*color: #EDEFF0;*/
  /*color: #F0F0F0;*/
  color: white;
}

.grey-font {
  color: #cfd2da;
}

dd {
  color: #cfd2da;
}

.panel-heading {
  font-family: 'Raleway', sans-serif;
  font-size: 120%;
}

ul > li.list-group-item {
  text-align: left;
}

@media (min-width: 100px) { 

  .plan {
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .no-pad {
    padding-left: 0px;
  }

  .vert-pad {
    margin-top: -20px;
    margin-bottom: 50px;
  }

  .fyi {
    margin-top: 0px;
    margin-bottom: 50px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .splash-img {
    display: none;  
  }

}

@media (min-width: 768px) {

  .plan {
    margin-top: 30px;
  }

  .fyi {
    margin-top: 50px;
    margin-bottom: 50px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .splash-img {
    display: initial;
  }

}

@media (min-width: 992px) {

  .plan {
    margin-top: 0px;
  }

  .splash-img {
    display: initial;
  }

}

@media (min-width: 1200px) { 

  .splash-img {
    display: initial;
  }

  .no-pad {
    padding-left: 15px;
  }

  .vert-pad {
    margin-top: 60px;
  }

  .bullets {
    text-align: left;
  }

  .fyi {
    margin: 60px;
  }

}

.gradient {
  /*background: #282c35*/
  background: #252830;
}

dt {
  margin-top: 20px;
  font-size: larger;
}

.feature span {
  padding: 0.25em;
  /*text-shadow: 4px 4px 10px rgba(0,0,0,0.3);*/
  /*text-shadow: 1px 1px 1px rgba(0,0,0,0.4);*/
}

.feature p {
  font-size: 65%;
  color: rgba(240, 240, 250, 0.8);
  padding: 25px 0px;
  /*text-shadow: 1px 1px 1px rgba(0,0,0,0.4);*/
}

.upgrade-feature {
  /*font-size: 12px;*/
  /*color: #7b8994;*/
  /*line-height: 1.76923;
  font-weight: 600;*/
}

.upgrade-feature.disabled {
  color: #ccc;
}

.card {
  /* border: 1px solid rgba(0,0,0,0.1); */
  /* border-radius: 2px; */
  border-top: 7px solid;
  /* border-top-color: rgba(49,176,213,0.5); */
  border-top-color: #337ab7;
  background-color: #fff;
  padding: 25px 25px;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
}

.dark {
  background-color: #286090;
}

.fa-check-circle {
  color: green;
}

.fa-check-circle.disabled {
  color: gray;
}

.splash {
  text-align: center;
}

.chart {
  background: #eee;
  padding: 3px;
}

.plan {
  border-top: 7px solid;
  /*border-top-color: #ff6437;*/
  border-top-color: #337ab7;
  background-color: #fff;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.2);
  padding: 25px 25px;
}

.plan.pro {
  border-top-color: #1ED760;
  /*border-top-color: #337ab7;*/
}

.free-color {
  /*color: #ff6437;*/
  color: #1ED760;
}

.pro-color {
  color: #1ED760;
}

.chart div {
  width: 0;
  transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -webkit-transition: all 1s ease-out;
}

.chart div {
  font: 10px sans-serif;
  background-color: blue;
  text-align: right;
  padding: 3px;
  margin: 5px;
  color: white;
  box-shadow: 2px 2px 2px #666;
}

.snd {
  border: 1px solid rgba(0,0,0,0.1);
  /* border-radius: 2px; */
  background-color: #fff;
  padding: 25px 25px;
  /*margin: 4px;*/
}

.snd-thumb {
  float: left;
  padding: 5px 0px;
}

div svg:not(:first-child) {
  margin-top: -6px;
  margin-bottom: -6px;
}

/*
.snd-thumb:hover {
  background-color: #dfd !important;
}
*/

.snd-link {
  margin: 10px;
}

.snd-player {
  padding: 15px;
  margin-left: 50px;
}

.blurb {
  padding: 5px 0px;
}

ul.list-group {
  color: #333;
}

.tag {
  margin: 5px;
  padding: 8px;
  font-size: 120%;
}

.vspace {
  margin-bottom: 5px;
}

.snd-waveform {
  margin: 2em 2em;
  border-color: rgba(0,0,0,0.1);
  border-style: solid;
  border-width: 2px 2px 2px 2px;
  /*border-radius: 2px;*/
  /*box-shadow: 1px 2px 4px 2px rgba(0, 0, 0, 0.1);*/
}

.snd-waveform > svg {
  background-color: rgba(255, 255, 255, 1.0)
}

.snd-waveform > svg:not(:first-child) {
  border-top: 1px solid #cfd6d9;
}

.border {
  border: 1px solid gray;
  border-radius: 2px;
}

.set {
  min-height: 250px;
}

.set-title {
  background-color: #fbfbfb;
  border-top: 7px solid;
  border-bottom: 1px solid rgba(0,0,0,0.1);
  border-top-color: #337ab7;
  z-index: 1;
}

.set:hover {
  background-color: #efe !important;
}

.editbtn {
  width: 90px;
  margin-bottom: 10px;
}

.avatar {
  width: 120px;
  height: 110px;
  float: left;
}

.title {
  font-family: 'Raleway', sans-serif;
}

legend {
  color: #DDD;
}

/*.bkg {
  background: #282c35;
}*/

.jumbotron {
  background: #282c35;
  padding-bottom: 0px;
}

.jumbotron h1 {
  color: #fff;
  letter-spacing: 0.05em;
}

.jumbotron h2 {
  color: rgba(255, 255, 255, 0.8);
  font-size: 150%;
  letter-spacing: 0.1em;
}

.error {
  border: 2px solid red;
}

.lightbkg {
  background: #505050;
}

.navbar-brand {
  font-family: 'Raleway', sans-serif;
  font-size: 170% !important;
}

.footer-brand {
  font-family: 'Raleway', sans-serif;
  font-size: 130% !important;
}

.navbar-inverse .navbar-brand {
  color: #eee;
}

.navbar {
  font-family: 'Open Sans', sans-serif;
  border-radius: 0px;
  font-size: 16px;
}

.navbar-default .navbar-nav>li>a{
  color: #337ab7;
}

.navbar-inverse .navbar-nav>li>a{
  color: #ddd;
}

.box-shadow {
  box-shadow: 0 2px 4px rgba(0,0,0,0.25);
}

.navbar-brand {
  font-size: 22px;
}

h1 i {
  margin-left: 20px;
  text-shadow: 1px 1px rgba(0,0,0,0.25);
}

.dropzone {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.upload-area {
  min-height: 200px;
}

.dragover {
  border: 4px solid #449d44;
}

.play-control {
  float: left;
  /*min-width: 50px;*/
  font-size: 100%;
}

.audio-control {
  margin-left: 5px;
}

.playing {
  color: #fea !important;
}

.notplaying {
  color: #eee;
}

.sound-info tr>td:first-child {
  color: #666;
}

.modal-backdrop.fade.in {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

#toast-container .toast {
  opacity: 0.95;
}

.toast-top-right {
  top: 70px;
}

.svg-background {
  background-color: #fbfbfb;
}

.axis path,
.axis line {
  fill: none;
  stroke: #bbb;
  shape-rendering: crispEdges;
}

.axis text {
  font: 10px sans-serif;
  fill: #888;
}