@font-face {
    font-family: 'GothamHTF';
    src:url('../fonts/GothamHTFBold.eot');
    src:url('../fonts/GothamHTFBold.eot') format('embedded-opentype'),
        url('../fonts/GothamHTFBold.woff') format('woff'),
        url('../fonts/GothamHTFBold.ttf') format('truetype'),
        url('../fonts/GothamHTFBold.svg') format('svg');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'GothamHTF';
    src:url('../fonts/GothamHTFMedium.eot');
    src:url('../fonts/GothamHTFMedium.eot') format('embedded-opentype'),
        url('../fonts/GothamHTFMedium.woff') format('woff'),
        url('../fonts/GothamHTFMedium.ttf') format('truetype'),
        url('../fonts/GothamHTFMedium.svg') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'GothamHTF';
    src:url('../fonts/GothamHTFMedium.eot');
    src:url('../fonts/GothamHTFMedium.eot') format('embedded-opentype'),
        url('../fonts/GothamHTFMedium.woff') format('woff'),
        url('../fonts/GothamHTFMedium.ttf') format('truetype'),
        url('../fonts/GothamHTFMedium.svg') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'GothamHTF';
    src:url('../fonts/GothamHTFLight.eot');
    src:url('../fonts/GothamHTFLight.eot') format('embedded-opentype'),
        url('../fonts/GothamHTFLight.woff') format('woff'),
        url('../fonts/GothamHTFLight.ttf') format('truetype'),
        url('../fonts/GothamHTFLight.svg') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'GothamHTF';
    src:url('../fonts/GothamHTFBook.eot');
    src:url('../fonts/GothamHTFBook.eot') format('embedded-opentype'),
        url('../fonts/GothamHTFBook.woff') format('woff'),
        url('../fonts/GothamHTFBook.ttf') format('truetype'),
        url('../fonts/GothamHTFBook.svg') format('svg');
    font-weight: 300;
    font-style: normal;
}
html{ margin: 0px; padding: 0px;}
body{font-family: 'GothamHTF',sans-serif; font-size:14px; line-height:18px;position: relative; margin: 0px; padding: 0px; background:  #e3b3c9 fixed top center no-repeat;
    width: 100%;  overflow: auto; color: #ffffff; background: url('../images/back.jpg') #cbaeb0 fixed top center no-repeat; background-size:cover; }
img{ margin: 0px; padding: 0px; border: 0px;}
input{ position: relative; margin: 0px; padding: 0px}
a{ text-decoration: none;  color: inherit;  transition: all 0.5s ease;}
a:hover{ color: #cdb084; text-decoration: none; }
.img-fluid {
    display: block;
    height: auto;
    max-width: 100%;
    margin: 0px auto; position: relative;
}

.main_top{ position: relative; margin:10px auto 0px auto; max-width: 350px; }
#outer{  min-height: 618px; position: relative; min-width: 320px; overflow: hidden;}
.inner{ max-width: 780px; width:100%; position: relative; margin: 0px auto 0px auto; text-align: center; }

.shadow{ -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 1);
-moz-box-shadow:    0px 3px 5px 0px rgba(0,0,0, 1);
box-shadow:         0px 3px 5px 0px rgba(0,0,0, 1);}

.shadow2{-webkit-box-shadow: 0px 0px 8px 0px rgba(50, 50, 50, 1);
-moz-box-shadow:    0px 0px 8px 0px rgba(50, 50, 50, 1);
box-shadow:         0px 0px 8px 0px rgba(50, 50, 50, 1);}
.shadow4{-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 1);
-moz-box-shadow:    0px 0px 8px 0px rgba(0, 0, 0, 1);
box-shadow:         0px 0px 8px 0px rgba(0, 0, 0, 1);}
.shadow5{-webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.75);
-moz-box-shadow:    0px 2px 5px 0px rgba(0, 0, 0, 0.75);
box-shadow:         0px 2px 5px 0px rgba(0, 0, 0, 0.75);}
.sp20{ width: 100%; height: 20px; line-height: 20px; font-size: 20px; position: relative;}
 .sp40{ width: 100%; height: 40px; line-height: 40px; font-size: 40px; position: relative;}
 .sp60{ width: 100%; height: 60px; line-height: 60px; font-size: 60px; position: relative;}
 .sp80{ width: 100%; height: 80px; line-height: 80px; font-size: 80px; position: relative;}
 .sp100{ width: 100%; height: 100px; line-height: 100px; font-size: 100px; position: relative;}
.clear{ width: 100%; height: 0px; line-height: 0px; font-size: 0px; position: relative; clear: both;}

.main_ttl{ position: relative; color: #ffffff; font-size: 40px; line-height: 46px; text-transform: uppercase; font-weight: 400; width: 95%; margin: 0px auto 0px auto; max-width: 700px}
.main_ttl span{ display: inline-block; vertical-align: middle; max-width: 570px; position: relative; }
.main_ttl i {display: inline-block; vertical-align: middle; position: relative;}
.mob{ display: none; }
.main_ttl img{ width: 100%; position: relative; }
.content{ position: relative; width: 100%; position: relative;   }
.tw_icon{ color: #f4f4f4; font-size: 103px; line-height: 120px; text-align: center; }
.tw_box_ttl{ position: relative; font-size: 18px; line-height: 23px; color: #f4f4f4; font-weight: 700 }
.connect_bottom{ position: relative; margin-top: 50px; }
.connect_bottom a, .connect_bottom .signup {
    background-color: #000000;
    background-position: center center;
    background-repeat: no-repeat;
    border: 1px solid #ffffff;
    border-radius: 24px;
    box-shadow: 0 0 0 2px #000000;
    display: inline-block;
    height: 24px;
    line-height: 24px;
    margin: 0 20px;
    transition: opacity 600ms ease 0s;
    width: 24px;
}
.connect_bottom a:hover, .connect_bottom .signup:hover {
    opacity: 0.6;
}
.connect_bottom .twitter {
    background-image: url("../images/twitter.png");
    background-size: 14px auto;
}
.connect_bottom .facebook {
    background-image: url("../images/facebook.png");
    background-size: 8px auto;
}
.connect_bottom .instagram {
    background-image: url("../images/instagram.png");
    background-size: 16px auto;
}
.connect_bottom .soundcloud {
    background-image: url("../images/soundcloud.png");
    background-size: 18px auto;
}
.connect_bottom .apple {
    background-image: url("../images/apple.png");
    background-size: 16px auto;
}
.connect_bottom .spotify {
    background-image: url("../images/spotify.png");
    background-size: 16px auto;
}
.connect_bottom .bandsintown {
    background-image: url("../images/bandsintown.png");
    background-size: 12px auto;
}
.connect_bottom .contact {
    background-image: url("../images/contact.png");
    background-size: 18px auto;
}
.connect_bottom .signup {
    background-image: url("../images/signup.png");
    background-size: 14px auto;
}

.white_btn{ position: relative; width: 100%; background: #ffffff; border: 1px solid #8bacbc; transition: all 0.5s ease; }
.white_btn:hover{background: #25919e}
.white_btn a{ display: inline-block; vertical-align: middle; width: 100%; position: relative; padding: 14px 0px 14px 0px; color: #06192d; font-size: 34px; line-height: 40px; font-weight: 700 }
.white_btn span{ display: inline-block; vertical-align: middle; }
.white_btn i{ display: inline-block; vertical-align: middle; margin: 0px 10px 0px 0px; }
.tw_box_find{ position: relative; color: #ffffff; }
.tw_box_find span{ display: inline-block; vertical-align: middle; font-size: 16px; line-height: 24px; }
.tw_box_find i{ display: inline-block; vertical-align: middle; font-size: 24px; margin: 0px 5px 0px 0px; }
.tw_box_in{ position: relative; width: 100%; position: relative; border: 0px solid #ffffff; margin: 8px 0px 8px 0px }
.tw_box_in input{ width: 100%; height: 50px; text-indent: 10px; color: #ffffff; font-size: 40px; line-height: 43px; margin: 10px 0px 10px 0px; border: 0px; background: transparent; }
.loc{ position: absolute; top:20px; right: 15px }
.videoWrapper {
    position: relative;
    padding-bottom: 51.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 5px solid #ffffff
}
.vid{ background: #cccccc; margin: 50px auto 0px auto;  width: 100%; margin: 40px auto 0px auto; position: relative; }

.tw_box{ position: relative; padding: 0px 0px 30px 0px; }

footer{ position: relative; background: transparent; color: #ffffff; border-top: 0px solid #cccccc; }
.copy{ position: relative; margin: 10px 0px 0px 0px }
.copy span{ display: inline-block; vertical-align: middle; margin: 5px 5px 0px 5px; position: relative; }
.copy a{ display: inline-block; vertical-align: middle; margin: 5px 5px 0px 5px; position: relative; }
.radio_icon{ position: relative; margin: 10px 0px 0px 0px; text-align: center; }
.connect_top{ position: absolute; top:14px; left: 10px; z-index: 10 }
.connect_top span{ position: relative; vertical-align: middle; margin: 0px 4px 0px 0px; font-size: 20px; line-height: 35px}
.connect_top a{ display: inline-block; vertical-align: middle; margin: 0px 0px 0px 5px; font-size: 20px; line-height: 35px; }
.content .inner{ background:rgba(0,0,0,0.7); padding: 30px; border:1px solid #ffffff; }
.share_top{ position: absolute; top:14px; right: 10px; text-align: right; z-index: 10 }
.share_top span{ position: relative; vertical-align: middle; margin: 0px 4px 0px 0px; font-size: 20px; line-height: 35px }
.share_top a{ display: inline-block; vertical-align: middle; margin: 0px 0px 0px 5px; font-size: 20px; line-height: 35px; }
.enter_web{ position: absolute; top:14px; left: 0px; width: 100%;  font-size: 20px; line-height: 35px; }
.top_bar .inner{ max-width: 1000px }

#noProblemCities,
    #summerFriendsCities {
      margin: 0 auto 0.2em auto;
      width: 100%;
      padding: 5px 5px 5px 15px;
      font-size: 40px;
      border: 5px solid #fff;
      height: 85px;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border-radius: 0;
      outline: none;
      text-indent: 0.01px;
      text-overflow: '';
      text-align: left;
      background-color: transparent;
    }
    #noProblemCities::-ms-expand,
    #summerFriendsCities::-ms-expand {
      display: none;
    }
    #noProblemCities:focus,
    #summerFriendsCities:focus {
       outline: none;
    }
    .select-mask {
      position: relative;
    }
    .select-mask:before {
      content: "\f107";
      font-family: FontAwesome;
      font-style: normal;
      font-weight: normal;
      text-decoration: inherit;
      position: absolute;
      font-size: 55px;
      color: #ffffff;
      top: -28px;
      right: 4px;
      z-index: -1;
      bottom: -20px;
      border-left: 5px solid white;
      width: 65px;
    }
  .btn-container {
      margin: .5em auto 0;
  }
  #noProblemCities option,
#summerFriendsCities option {
    color: #06192d;
}
.tt-open {
    position:relative !important;
}

.twitter-typeahead {
  display:block !important;
}
.tt-suggestion.tt-selectable {
    font-size: 30px !important; line-height: 35px !important;
        -webkit-transition: 0.1s all linear;
      -moz-transition: 0.1s all linear;
      -o-transition: 0.1s all linear;
      transition: 0.1s all linear;
      color: #ffffff !important;
}
.tt-suggestion.tt-selectable:hover {
    cursor: pointer;
    text-shadow: 0px 2px 5px rgb(249,246,16);
}
.city{ position: relative;  }
.city h4{ color: #ffffff;   font-size: 40px !important; line-height: 45px !important;}
.city ul{ list-style: none; margin: 0px; padding: 0px; text-align: center; }
.city ul li{ position: relative; padding: 0px; margin: 10px 6px 0px 6px; list-style: none; display: inline-block; vertical-align: middle; }
.station-link {
      font-size: 22px !important;
      margin-bottom:6px !important;
    }
    .station-link:last-child {
      margin-bottom:0 !important;
    }

    .station-link:hover {
      text-decoration: none;
    }

    .btn-white {
      margin: 0.5em auto;
      padding: 25px 46px;
      font-size: 40px;
      text-transform: uppercase;
      letter-spacing: 1px;
      font-weight: 400;
      font-style: normal;
      background: transparent;
      border: 2px solid #fff;
      color: #FFF;
      border-radius: 0;
      -webkit-transition: 0.1s background-color linear, 0.1s color linear;
      -moz-transition: 0.1s background-color linear, 0.1s color linear;
      -o-transition: 0.1s background-color linear, 0.1s color linear;
      transition: 0.1s background-color linear, 0.1s color linear;
    }

    .btn-white:hover {
      background-color: #FFF;
      color: #000;
    }
        .btn-container {
      text-align: center;
      display: block;
      width: 100%;
      margin: 1.75em auto 0;
    }

    .btn-container:first-child {
      margin-top: 1.5em;
    }

    .btn-whiteRounded {
      display: inline-block;
      width: auto;
      height: auto;
      background-color: #FFF;
      color: #06192d;
      font-size: 17px;
      border-radius: 300px;
      padding: 14px 36px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
      -webkit-transition: 0.1s all linear;
      -moz-transition: 0.1s all linear;
      -o-transition: 0.1s all linear;
      transition: 0.1s all linear;
    }

    .btn-whiteRounded:hover {
      color: #06192d;
      box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
      transform: translateY(-1px);
    }

    .btn-tweetButton {
      background-color: #FFF;
      color: #0084b4;
      font-size: 20px;
      padding: 5px 20px;
      border-radius: 300px;
      margin: 0.25em auto;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
      -webkit-transition: 0.1s all linear;
      -moz-transition: 0.1s all linear;
      -o-transition: 0.1s all linear;
      transition: 0.1s all linear;
    }

    .btn-tweetButton:hover {
      color: #FFF;
      background-color: #0084b4;
      text-decoration: none;
      box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
      transform: translateY(-1px);
    }

    .top_bar{ width: 100%; position: relative; top:0px; left: 0px; z-index: 10 }
    .logo{ position: relative; display: inline-block; vertical-align: middle; margin: 15px 10px 0px 10px; text-align: center; }
    .presents{ position: relative; display: inline-block; vertical-align: middle; margin: 15px 10px 0px 10px;text-align: center; width: 95%; max-width: 404px }
    .presents img{ width: 100%; position: relative; }
    .feat{ position: relative; font-size: 35px; margin: 15px auto 0px auto; width: 95%; line-height: 40px; color: #cccccc }
    .type_note{ color: #ffffff; position: relative; font-size: 16px; line-height: 20px; text-align: center; width: 95%; margin: 0px auto }
    .spotify .player{ width: 100%; position: relative; }
    .spotify .player img{ width: 100%; position: relative; border: 5px solid #ffffff; width: 100%; display: block; }
     .spotify .player iframe{ width: 100%; position: relative; border: 5px solid #ffffff; width: 100%; display: block; }
     .follow{ position: relative; float: left;  margin: 5px 0px 0px 0px; color: #f4f4f4}
     .share_play{ position: relative; float: right; text-align: right; margin: 5px 0px 0px 0px; color: #f4f4f4 }
     .follow span{ position: relative; color: #f4f4f4; font-size: 20px; line-height: 24px; display: inline-block; vertical-align: middle; }
     .follow img{ position: relative; display: inline-block; vertical-align: middle; margin: 0px 5px 0px 0px }
      .share_play span{ position: relative; color: #f4f4f4; font-size: 20px; line-height: 24px; display: inline-block; vertical-align: middle; }
     .share_play img{ position: relative; display: inline-block; vertical-align: middle; margin:  0px 0px 0px 4px }
     .player_in{ position: relative; z-index: 10 }

     .content .inner{ margin-top: -50px }
     .head_img{ padding: 20px 0px 20px 0px; }

     .top_bar .inner{ max-width: 840px; }
.connect_top { position: relative;  color: #ffffff; text-align: center; padding: 10px 0px 10px 0px; width: 100%; text-align: center; font-size: 30px; }

.connect_top a{ font-size: 30px; line-height: 35px; }
.socials{ position: relative; }
.socials a{ color:#ffffff; margin: 6px; font-size: 30px; line-height: 30px }
.radio_icon{ display: none; }
.custom_btns{margin-top: 25px; flex-wrap: wrap;; position: relative;display: flex; align-items: center; justify-content: space-between; }
.custom_btns div{width: 30%; margin-top: 15px;}
.custom_btn{ color:#ffffff; text-align: center; background: rgba(0,0,0,0.8); border:4px solid #ffffff; display: block; padding: 10px; font-size: 25px; line-height: 30px; }
.custom_btn:hover{ background: #ffffff; color:#000000; }
.socials{ margin-top: 60px; }

    @media handheld, only screen and (max-width: 800px) {
      
  .nbr{ display: none !important; }
      .tw_icon { display: none !important; }
.custom_btns div{ width: 100%; }
        .item{ width: 46%; margin:1%; position: relative; display: inline-block; vertical-align: top; float: none; }
       .inner{ width: 95%; }
        .main_ttl{ font-size: 34px; line-height: 40px; }
        
        .share_play{ float: none; width: 100%; text-align: center; }
        .follow{ float: none; width: 100%; text-align: center; }
    

    }

 @media handheld, only screen and (max-width: 840px) {

  .top_bar{ position: relative; background: transparent; border-bottom: 1px solid #ffffff }
  .top_bar .inner{ padding: 10px 0px 10px 0px; }
  .connect_top{ position: relative; top:0px; left: 0px; width: 100%; text-align: center; }
   .mob{ display: block; }
  .desk{ display: none !important; }

 }

@media handheld, only screen and (max-width: 700px) {
body{ background: url(../images/back.jpg?v=2) #e3b3c9 fixed top center no-repeat; background-size: 100% auto }

}
 @media handheld, only screen and (max-width: 600px) {

  .loc{ display: none; }
  .white_btn a{ font-size: 24px; line-height: 30px; }
  #cities_field{ font-size: 30px; }

 }