@import 'common';

#jamtrackLanding {
  //font-family: verdana;
  .two-column-list-container {
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
    margin-left: 0;
    ul {
      list-style-type: none;
      li {
        margin: 1px 4px 1px 0;
        font-size:12px;
        line-height:14px;
      }
    }
  }

  ul {
    li {
      margin: 1px 4px 1px 4px;
      font-size:12px;
      line-height:14px ;
    }
  }

  #band_list {
    margin-top:10px;
    margin-left:0;

    li {
      font-size:12px;
    }
  }
  .browse-header {
    padding: 4px 0 4px 0;
    color:#ccc;
  }

  .list-columns {
    h2 {

      font-size: 20px;
      font-weight:700;
      text-transform: lowercase;
      margin-bottom: 10px !important;
    }

    .free-jamtrack {
      font-size: 11pt;
      padding: 3px;
      @include border-radius(7px);
      background-color:$ColorScreenPrimary;
      color: white !important;
      text-align: center;
      vertical-align: center;
    }

    .what, .howto {
      margin-bottom: 2em;
      font-size: 14px;
      line-height: 19px;
      color: #cccccc;
    }

    .what ul {
      margin-top:20px;
    }

    .details {
      margin-bottom: 4px !important;
    }

    .about {
      @include border_box_sizing;
      float: left;
      width: 50%;
      padding:20px 20px 0 20px;
      > * {
        margin: 4px;
      }
    }
    .browse {
      @include border_box_sizing;
      float: left;
      width: 50%;
      padding:20px 20px 0 20px;
      > * {
        margin: 4px;
      }

      h2.browse-jamtracks {
        margin-top:30px;
      }
    }
  }
  .video-container-container {

  }
  .video-container {
    width:80%;
    padding-top:56.25%;
    margin:30px 0 30px 30px;
  }

  .video-thumbnail {
    width:80%;
    padding-top:56.25%;
    margin:30px 0 30px 30px;
    background:url(//img.youtube.com/vi/askHvcCoNfw/maxresdefault.jpg) no-repeat center;
  }
}
