@font-face {
    font-family: 'source_sans_prolight';
    src: url('fonts/sourcesanspro-light-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'source_sans_proregular';
    src: url('fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'source_sans_prosemibold';
    src: url('fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'),
         url('fonts/sourcesanspro-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0; font-size: 62.5%; font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
*{box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
body{font-family: 'source_sans_proregular', sans-serif; letter-spacing: 1px; line-height: 1.5; font-size:1rem;}
input, textarea{border: 1px solid #eaeaea; font-family: source_sans_proregular;}
.clearfix{ clear: both;}
.pd-btm-20{padding-bottom:20px;}
.flt{float:left;}
.frt{float:right;}
input[type='submit']{cursor: pointer;}
h2{font-size:1.2rem; font-family: 'source_sans_prosemibold'; color: #008aff; padding-bottom: 15px; line-height: 1.2;}
h4{font-size:1.2rem;}
li{list-style-type:none;}
a{text-decoration:none; color:#000;}
p{margin-bottom: 16px;}
.flex-wrapper{display:flex;}
.clearfix{clear:both;}
.center-block{float:none;}
.text-center{text-align:center;}
.overflow-handler{overflow:hidden;}
.light-grey{color:#666;}
.font-blue{color:#008aff;}
.grey-bg{background-color:#f0f0f0;}
.logo img{ max-width: 112px;}
.headerWrapper{ margin: 0 auto;}
.twitter-wrapper{ height: 150px; overflow: auto; margin-top: 20px;}
.hamburger{ display: none;}
.column-layout{column-count: 4;}
.small-txt{ font-size: 12px;}
@media screen and (max-width: 640px){
    .hamburger{ display: block; margin-top: 10px; float: right;}
    .selection-type{ display: none;}
    .column-layout{column-count: 1;}
    .headerWrapper {padding: 0 15px;}
}

.selection-type{text-align:right; clear: both; padding: 10px 0 0 0; font-size: 0.9rem;}
.selection-type li .active, .selection-type li a:active{color:#008aff;}
.middleWrapper{margin-top:20px; margin-bottom:10px;}
.middleWrapper.col-md-12{padding:0;}

.start-section a {color:#008aff; padding-bottom: 15px; font-size: 22px;}
.middle-section{ margin-bottom: 20px;}
.middle-section img{width:100%;}
.middle-section a{font-style: italic; font-size: 0.8rem;}
.middle-section .jp-title p{ font-size: 18px; padding-top: 10px;}
.middle-section .music-list img{width:inherit;}
.jp-title p{ line-height: 1.3;}

.box-list{justify-content: space-between; margin-bottom: 10px;}
.box-list li{border: 1px solid #ccc; text-align: center; flex-grow: 1;
    flex-basis: 0;
    max-width: 154px;
    padding: 14px 8px;}
    .box-list li a{display: block;}
.box-list li img{width: 48px;}
@media screen and (max-width: 640px){
    .raag-wrapper{ display: none;}
    .small-intro-pane, .mobile-scroll{ height: 95px; overflow: hidden; transition: 1s;}
}
@media screen and (min-width: 640px){
    .hide-desktop{ display: none;}
    .middleWrapper .start-section{padding-left:0; padding-right: 0;}
    .col-md-5.end-section, .col-md-4.end-section{ padding-right: 0;}
    .small-intro-pane{ max-height: 262px; overflow: hidden;}
    #home-scroll{ min-height:  267px;}
    #collective-scroll{ min-height:  432px;}
}
@media screen and (min-width: 640px){
    .intro-pane{ max-height: 412px; overflow: hidden;}
}
.end-section .show-scroll{ color: #008aff; line-height: 1; float: left; margin-top: -8px;}
.music-container li{ width: 100%; padding-right: 0; margin-bottom: 30px; overflow: hidden;}
.music-container li img{ width: 20%; float: left; margin-right: 20px;}
.music-container li p{ width: 70%; float: left;}
.user-details button{border:1px solid #eaeaea; padding:8px; margin:20px 0;}
.user-details input{padding:8px;}
.user-details{margin:15px 0;}
.form-section h1{line-height: initial;}
.submit-button{border:2px solid #008aff; color:#008aff; width: 100%; cursor: pointer; text-align: center; display: block; background: #fff; padding:10px 25px; font-weight: bold; font-size: 16px;}
.submit-button:hover,.submit-button:active{border:2px solid #008aff;}
.user-details input.submit-button:hover{border:2px solid #008aff;}
/* #aboutUs .headerWrapper{background-image: url('images/azeem-banner.jpg'); background-repeat: no-repeat; 
   background-size: 100% 100%;} */
.option-list li{width: 100%; display: block; padding-bottom: 6px;}
.option-list a{display:inline-block;}
.option-list li .col-md-3{ padding-left: 0; padding-right: 15px; }
.option-list li .col-md-9{ padding: 0;}
.option-list li img{ width: 100%;}
.option-list li h2{ padding-bottom: 14px;}
.option-list a .col-md-7{padding-right:0;}
.option-list li a p{ overflow: hidden; height: 69px; line-height: 1.4; text-overflow: ellipsis; display: inline-block;}
.option-list a h4{color:#008aff; padding-bottom:12px;}
.footerWrapper{padding:10px; font-size: 0.8rem; width: 100%; margin-bottom:5px;}
.social-links{ text-align: center;}
.social-links a{padding: 0 3px;}
.footerWrapper a, .copy{color:#8d8d8d;}
.copy{ text-align: center; width: 100%; margin: 0}
.audio-list{justify-content:flex-start; margin-bottom:10px; flex-wrap: nowrap;}
.audio-list li{ flex-grow: 1; flex-basis: 0; max-width: 138px; min-width: 138px; margin:0 38px 10px 0;}
.audio-list li:last-child{ margin-right: 0;}
.audio-list li img{ width: 100%; cursor: pointer;}
.audio-list li:last-child{ padding: 0;}
.audio-list-wrapper{ position: relative; margin-bottom: 20px;}
.audio-scroll{position: absolute; left: 0;  bottom: 0; font-size: 22px; color: #008aff;}
.section-title{ font-size: 34px; font-family: source_sans_prolight}
.insta-link{ padding: 10px 10px 10px 55px; background: url(../images/insta-logo.png) no-repeat 16px 8px; background-size: 28px 28px;  border: 1px solid #eaeaea; display: block; margin-bottom: 10px;}
.insta-link:hover, .insta-link:focus{ border: 1px solid #eaeaea; } 
.user-details input, .user-details textarea{ width: 100%; margin: 10px 0; padding: 10px;}
.user-details input.error, .user-details textarea.error{ margin: 0;}
.user-details input:hover, .user-details input:focus, .user-details input:active,
.user-details textarea:hover, .user-details textarea:focus, .user-details textarea:active{border: 1px solid #eaeaea}
.user-details textarea{ height: 70px; resize: none;}
.user-details h3{ width: 100%; text-align: center; font-size: 20px; }
.youtube-video-wrapper{ margin-bottom: 10px;}
@media screen and (max-width: 640px){
    .logo img { max-width: 80px;}
    .user-details { margin: 30px 0 15px 0;}
    .audio-list{flex-wrap: wrap;}
    .audio-list li{ min-width: 45%; max-width: 45%; margin:0 30px 20px 0;} 
    #home-page .audio-list li{ min-width: inherit; max-width: inherit;}
    h4{font-size:1rem;}
    h2{font-size:1.2rem; line-height:1.2; }
    .social-links a{ padding: 0 4px;}
    .top-grey{ padding-bottom: 15px;}
    .option-list h2{ line-height: 0.9;}
    .audio-list-wrapper{ padding-bottom: 20px; overflow: hidden;}
    #home-page .audio-list.flex-wrapper{ display: block;}
    #home-page .audio-list-wrapper li{ float: left; display: block;}
    .audio-scroll{ right: inherit; left: 0;}
    .middle-section{ margin: 30px 0 40px 0;}
    .selection-type{ padding-right: 0;}
    .selection-type li a{font-size:1rem; line-height: 0.8;}
    .col-md-4.end-section{padding:0;}
    #aboutUs .col-md-4.end-section{padding:0 15px;}
    .option-list li .col-md-9{padding-left: 10px;}
    .option-list li .col-md-3{ padding-right: 5px;}
    .option-list li h2 {padding-bottom: 4px;}
    .option-list li a p{height:60px; line-height: 1.3;}
    .option-list .col-xs-8{padding:0;}

}
.top-grey{ padding-top: 30px; border-top: 1px solid #ccc;}
.send-success{ display: none; }
h3.light-grey{ font-size: 1.5rem; font-family: source_sans_prolight;}
.share-icon{ margin: 5px 0 0 20px;}
.sharethis-inline-share-buttons{ width: 37%; float: left; }
.youtube-iframe{ aspect-ratio: 16 / 9;}
