@charset "utf-8";
/*-- Last updated:  26-Mar-2018     Version: 1.0                         */
/*-- Copyright 2018  MusicBiz Enterprises, All rights reserved.          */


#mContainer_padBio {
   height: 140px;   /* header is 160px, hidden site logo has margin: 10px 0 10px 0  */
}

/*-------------------*/
/*  Bio Container */
/*-------------------*/
.mContainer_Bio {
   clear: both;
   width: 100%;
   /* height: 250px; */
}
.bandMember_bioBox {
   clear: both;
   width: 100%;
   /* padding-top: 50px; */
}
.bandMember {
   clear: both;
   width: 100%;
   margin: 0px;
   padding-bottom: 100px; 
}
.bioAnchor {
   padding-top: 160px;
   margin-top: -160px;
   display: inline-block;  /* required for webkit browsers */
}
.bioBox {
   clear:  both;
   float:  left;
   width:  100%;
   padding-top: 100px;
}

/*-----------*/
/* Photo Box */
/*-----------*/
.bioPhotoBox {
   float: left;
   /* width: 500px; */
   width: 40%;
   padding: 0 0 20px 0;
   margin: 0;
}
/*
.bioPhotoBox_left {
   float: left;
}
.bioPhotoBox_right {
   float: right;
}
*/
.bioPhoto {
}
img.bioPhoto {
   width: 320px;
   height: auto;
   margin: 0 auto;
}

/*-----------*/
/* Title Box */
/*-----------*/
.bioText_TitleBox {
   float: left;
   width: 60%; 
   padding: 0 0 20px 0;
   margin: 0;
}
.bioTitle {
   /* clear:  both; */
   float:  left;
   width:  100%;
   padding-top: 0px;
   text-align: left;
   font-size: 4em;
   font-size: 4rem;
   font-weight: bold;
}
.bioInstrument {
   /* clear:  both; */
   float:  left;
   width:  100%;
   padding-top: 10px;
   text-align: left;
   font-size: 3em;
   font-size: 3rem;
   font-weight: bold;
}
.bioWebsite {
  /* clear:  both; */
   float:  left;
   width:  100%;
   padding-top: 10px;
   text-align: left;
   font-size: 2em;
   font-size: 2rem;
   font-weight: bold;
}

/*-----------*/
/* Text Box */
/*-----------*/
.bioTextBox {
   /* float: left; */ /* this causes text to start below photo */
   /* width: 60%; */
   padding: 0;
   margin: 0;
}
/*
.bioTextBox_left {
   float: left;
   width: 40%;
   margin: 0;
   padding: 0 2% 20px 2%;
}
.bioTextBox_right {
   float: right;
   width: 60%;
   margin: 0;
   padding: 0 2% 20px 2%;
}
*/
.bioText {
   display: block;
   font-size: 1.5em;         /* relative to current element font-size -- nesting inheritance applies         */
   font-size: 1.5rem;        /* relative to root default font-size -- place after em, since rem is css3      */
   margin: 0;
   padding: 0 5% 0 5%;
   text-align: left;
   font-family: 'Montserrat';
}
/*
.bioText_left {
   float: left;
   margin: 0;
   padding: 0 2% 20px 2%;
}
.bioText_right {
   float: right;
   margin: 0;
   padding: 0 2% 20px 2%;
}
*/

/*-----------*/
/* Video Box */
/*-----------*/
.bioVideoBox {
   /* clear: both; */
   /* float: left; */
   padding-top: 20px;
}
/*
.bioVideoBox_left {
	clear: both;
	float: left;
	margin: 0 7% 40px 7%;
}
.bioVideoBox_right {
	clear: both;
	float: right;
}
*/
.bioVideo_Heading {
   display: block;
   clear: both;
   width: 100%;
   margin:   0.5rem 0 0.5rem 0;
}
.bioVideo_Link {
    display: block;
    clear: both;
    width: 480px;
    margin: 20px 0 0 40%;
}
.bioVideo_iFrame {
   display: block;
   width:  480px;
   height: 270px;
   margin:  0 auto;
}

/*-----------------------*/
/*  @media definitions   */
/*-----------------------*/

@media only screen and (max-width: 1920px) {
}

@media only screen and (max-width: 1366px) { /* iPad Pro 12.9" view port size is 1366 x 1024 */
}

@media only screen and (max-width: 1112px) { /* iPad Pro 10.5" view port size is 1112 x 834 */
}

@media only screen and (max-width: 1080px) {  /* Switch from menu bar to menu button */
   #mContainer_padBio {
      height: 0px;
   }
   .mBioAnchor {
      padding-top: 60px;
      margin-top: -60px;
   }

   .bioPhotoBox {
      width: 30%;
   }
   img.bioPhoto {
      width: 260px;
   }
   .bioText_TitleBox {
	  width: 70%; 
   }

   .bioTitle {
      font-size: 3.5em;
      font-size: 3.5rem;
   }
   .bioInstrument {
      font-size: 2.5em;
      font-size: 2.5rem;
   }
   .bioWebsite {
      font-size: 1.5em;
      font-size: 1.5rem;
   }
	
   .bioVideo_Link {
       margin: 20px 0 0 30%;
   }
    
}

@media only screen and (max-width: 1024px) { /* iPad, iPad Mini view port size is 1024 x 768 */

}

@media only screen and (max-width: 980px) {
   img.bioPhoto {
      width: 240px;
   }
   .bioTitle {
      font-size: 3.0em;
      font-size: 3.0rem;
   }
   .bioInstrument {
      font-size: 2.0em;
      font-size: 2.0rem;
   }
   .bioWebsite {
      font-size: 1.0em;
      font-size: 1.0rem;
   }
}

@media only screen and (max-width: 840px) {
   img.bioPhoto {
      width: 200px;
   }
   .bioTitle {
      font-size: 2.0em;
      font-size: 2.0rem;
   }
   .bioInstrument {
      font-size: 1.5em;
      font-size: 1.5rem;
   }
   .bioWebsite {
      font-size: 1.0em;
      font-size: 1.0rem;
   }
}

@media only screen and (max-width: 720px) {
   .bioPhotoBox {
      width: 100%;
   }
   img.bioPhoto {
      width: 260px;
   }
   .bioText_TitleBox {
	  width: 100%; 
   }
   .bioTitle, .bioInstrument, .bioWebsite {
      text-align: center;
   }
   .bioText {
      font-size: 1.0em;         
      font-size: 1.0rem;        
      margin: 0;
      padding: 0 1% 0 1%;
   }
   .bioVideo_Link {
      margin-left: 15%;
   }
}

@media only screen and (max-width: 650px) { 
   .bioVideo_Link {
       width: 320px;
       margin-left: 25%;
    }
   .bioVideo_iFrame {
      width:  320px;
      height: 180px;
   }
}

@media only screen and (max-width: 550px) { 
   .bioVideo_Link {
      margin-left: 20%;
   }
}

@media only screen and (max-width: 450px) { 
   .bioVideo_Link {
      margin-left: 15%;
   }
}

@media only screen and (max-width: 414px) { /* iPhone 8 plus view port size is 414 x 736 */
   .bioVideo_Link {
      margin-left: 10%;
   }
}

@media only screen and (max-width: 375px) { /* iPhone 8 view port size is 375 x 667 */
   .bioVideo_Link {
      margin-left: 5%;
   }
}

@media only screen and (max-width: 320px) { /* iPhone SE view port size is 320 x 568 */
   .bioVideo_Link {
      margin-left: 0;
   }
}