@charset "utf-8";
/*-- Last updated:  22-Mar-2018     Version: 1.0                         */
/*-- Copyright 2018  MusicBiz Enterprises, All rights reserved.          */
/* songPlayer.css must be included before this file, followed by         */
/* songList.css must be included before this file                        */


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


/*-------------------*/
/*  Music Container  */
/*--------------------*/
.mContainer_musicMusic {
   clear: both;
   width: 100%;
   height: 850px;
}


/*-----------------------------------------------*/
/*  SongList -- defined in mStyles6_Custom_MIDmo */
/*-----------------------------------------------*/
.mContainer_musicSongs {
   width: 100%;
   height: 850px;
}


/*-----------*/
/* Playlist  */
/*-----------*/
.playlistBox {
   /* clear: both; */
   float: left;
   width: 100%;
   padding-bottom: 50px;
}
.playlistTitle {
   padding-top: 20px;
   text-align: center;
   font-size: 2.0em;
   font-size: 2.0rem;
   font-weight: bold;
}

/*----------------*/
/* playlist_Song  */
/*----------------*/
.playlist_songBox {
   /* clear: both; */
   float: left;
   width: 50%;
   margin-left: 25%;
   padding-top: 30px;
   /*background-color: aqua;*/
}
.playlist_songRow {
   clear: both;
   float: left;
   width: 100%;
   margin-top: 20px;
   border-bottom: none;
}

.playlist_songTitle {
   float :left;
   width: 42%;
   margin-right: 3%;
   /*background: pink; */
}
.playlist_songArtist {
   float :left;
   width: 30%;
   margin-left: 0%;
   /*background: aqua; */
}
.playlist_songTitle, .playlist_songArtist {
   text-align: left;
   font-size: 1.5em;
   font-size: 1.5rem;
   line-height: 2.0rem;
   font-weight: normal;
}

.playlist_songLinks {
   float :left;
   width: 25%;
   margin-left: 0%;
   /*background: yellow; */
}
.playlist_songLink_row {
   height: 30px;
   width: 100%;
}
.playlist_songLink_iconBox {
   float: left;
   width: 30px;
   height: 30px;
   margin: 0 10px 0 10px;
   /*background-color: blue; */
}
.playlist_songLink_iconPic {
   height: 30px;
   width:  30px;
}

.playlist_songPreview {
   float :left;
   width: 5%;
   margin-left: 0;
}

.playlist_songTitle_header, .playlist_songPreview_header, .playlist_songArtist_header {
   font-weight: bold;
}

/*---------------*/
/*  Song Credits */
/*---------------*/
.container_musicCredits {
    width: 100%;
    /* height: 1100px; */
 }

.container_musicSong {
    width: 100%;
    /* height: 1100px; */
 }
.song_Box {
   clear: both;
   width: 100%;
   padding-top: 30px;
}
.song_Row {
   width: 100%;
   margin-bottom: 5px;
}
.song_Title {
    width: 100%;
    margin: 0 auto;
    font-weight: normal;
    font-size: 4rem;
    text-align: center;
 }

/*-----------------*/
/*  Composer List  */
/*-----------------*/
 .composer_Box {
    clear: both;
    width: 100%;
    padding-top: 30px;
 }
 .composer_Row {
    clear: both;
    width: 100%;
    padding-top: 10px;
    font-size: 2rem;
 }
 .composer_Role {
    float: left;
    width: 49%;
    text-align: right;
    background-color: transparent;
 }
 .composer_Separator {
    float: left;
    width: 2%;
    text-align: center;
    background-color: transparent;
 }
 .composer_Type, .composer_Lyrics, .composer_Music, .composer_Arrangement {
    float: left;
    width: 49%;
    text-align: left;
    background-color: transparent;
 }

/*--------------*/
/*  ArtistList  */
/*--------------*/
.container_musicArtist, .mContainer_musicArtist {
    width: 100%;
    height: 1100px;
 }
 .artist_Box, .mArtistList_Box {
    clear: both;
    width: 100%;
    padding-top: 10px;
 }
 .artist_Row, .mArtist_Row {
    clear: both;
    width: 100%;
    padding-top: 10px;
    font-size: 2rem;
 }
 .artist_Part, .mArtist_Part {
   float: left;
   width: 49%;
   text-align: right;
   background-color: transparent;
}
.artist_Separator, .mArtist_NameSeparator {
    float: left;
    width: 2%;
    text-align: center;
    background-color: transparent;
 }
 .artist_Name, .mArtist_Name {
   float: left;
   width: 49%;
   text-align: left;
   background-color: transparent;
}
 .artist_PartSong, .mArtist_PartSong {
    margin-top: 16px;
    padding-left: 5%;
    font-style: italic;
 }




/*-----------------------*/
/*  @media definitions   */
/*-----------------------*/
@media only screen and (max-width: 1920px) { 
   .mContainer_musicMusic {
      height: 930px;
   }

}

@media only screen and (max-width: 1540px) {
   img.mHolidayLink_Pic {
      width: 150px;
   }

   .playlist_songBox {
      width: 60%;
      margin-left: 20%;
   }
}

@media only screen and (max-width: 1460px) {
   .mContainer_musicMusic {
      height: 960px;
   }

   .mArtist_Name {
      width: 16%;
      margin-left: 18%;
   }
   .mArtist_Part {
      width: 60%;
   }

}

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

   .mArtist_Name {
      width: 20%;
      margin-left: 14%;
   }
   .mArtist_Part {
      width: 60%;
   }
   
   .mVideo_Box_Music {
      padding-left: 30%;
    }
}


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



@media only screen and (max-width: 1160px) {
    .mContainer_musicMusic {
      height: 850px;
    }
}


@media only screen and (max-width: 1080px) {  /* Switch from menu bar to menu button */
    .mPhotoBox {
     margin: 0;
     height: 320px;
     padding-top: 20px;
    }
    .mSiteLogo_PhotoBox {
      color: black;
      background-color:  rgb(255,178,125);       /* Midmo Orange */    
    }
    
   #mContainer_padMusic {
      height: 0px;
   }
   .mContainer_musicMusic {
      height: 1200px;
   }

   .playlist_songBox {
      width: 80%;
      margin-left: 10%;
   }

   .mContainer_musicSongs_Cruisin {
/*      background-image: url('../images/MIDmo_Cruisin_insideFlap_02.jpg'); */
   }
   .mContainer_musicSongs_CityLights {
/*      background-image: url('../images/cityLights_cobblestone_02.jpg'); */
   }
   .mContainer_musicSongs_ChristmasSpirit {
      width: 100%;
      padding-right: 0%;
   }

   .mContainer_musicHoliday {
      height: 1150px;
   }
   .mAlbumCover_Box_Holiday {
      width: 100%;
   }
   img.mHolidayCover_Pic {
      width: 460px;
      margin-top: 0px;
   }
   .mHolidayLink_Box {
      width: 100%;
      padding: 0 10% 0 10%;
   }
   img.mHolidayLink_Pic {
      width: 150px;
      margin: 0 auto;
   }

   .mArtist_Row {
      font-size: 1.5em;
      font-size: 1.5rem;
   }

}


@media only screen and (max-width: 1024px) { /* iPad, iPad Mini view port size is 1024 x 768 */
   .mVideo_Box_Music {
      padding-left: 28%;
    }

}

@media only screen and (max-width: 980px) {
   .playlist_songBox {
      width: 90%;
      margin-left: 5%;
   }
}


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

   .playlist_songBox {
      width: 96%;
      margin-left: 2%;
   }

   .mArtist_Name {
      width: 24%;
      margin-left: 10%;
   }
   .mArtist_Part {
      width: 60%;
   }
   .mSongList_spirit .mSong_Number {
      font-size: 20px;
   }
   .mSongList_spirit .mSong_Title {
      font-size: 20px;
   }

   img.mHolidayLink_Pic {
      width: 130px;
   }

}

@media only screen and (max-width: 800px) {
   .mContainer_musicMusic {
      height: 900px;
   }

   .playlist_songTitle {
      width: 52%;
      margin-left: 3%;
      margin-right: 2%
   }
   .playlist_songArtist {
      width: 40%;
      margin-left: 0%;
   }
   .playlist_songLinks {
      width: 70%;
      margin-left: 5%;
   }
   .mArtist_Name {
      width: 28%;
      margin-left: 6%;
   }
   .mArtist_Part {
      width: 60%;
   }

   .mVideo_Box_Music, .mVideo_Heading_Music {
      width: 480px;
      padding-left: 20%;
    }
   
}


@media only screen and (max-width: 670px) {
   .mContainer_preOrder, .mContainer_order {   
      height: 620px;
   }
   .mContainer_musicHoliday {
      height: 1000px;
   }
   img.mHolidayCover_Pic {
      width: 320px;
      margin-top: 0px;
   }

   .mVideo_Box_Music, .mVideo_Heading_Music {
      padding-left: 10%;
    }
    
   .playlist_songTitle {
      width: 50%;
      margin-left: 5%;
    }
   .playlist_songArtist {
      width: 40%;
    }
    
   .composer_Row, .artist_Row {
      font-size: 1.5rem;
   }
}


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

   .mArtist_Name {
      width: 33%;
      margin-left: 6%;
   }
   .mArtist_Part {
      width: 55%;
   }
      
   .mHolidayLink_Box {
      padding: 0 1% 0 1%;
   }
   img.mHolidayLink_Pic {
      width: 130px;
      margin: 0 auto;
   }

   .mVideo_Box_Music, .mVideo_Heading_Music {
      width: 96%;
      padding-left: 2%;
    }
   
   .mVideo_iFrame_HolyNight {
      width: 380px;
      height: 227px;
   }
   
   .playlist_songTitle, .playlist_songArtist {
      font-size: 1rem;
      line-height: 1rem;
    }

}

@media only screen and (max-width: 500px) {
   .mContainer_musicHoliday {
      height: 1050px;
   }

}


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

   .mSongList_spirit .mSong_playBTN {
      padding-left: 15%;
   }
   .mSongList_spirit .mSong_Title {
      width: 50%;
   }
   .mSong_Number, .mSong_Title {
      font-size: 20px;
   }
   .mSong_Title {
      width: 63%;
   }

   .composer_Row, .artist_Row {
      font-size: 1.25rem;
   }
   
}


@media only screen and (max-width: 414px) { /* iPhone 8 plus view port size is 414 x 736 */

   .mVideo_Box_Music, .mVideo_Heading_Music {
      width: 96%;
      padding-left: 2%;
    }
   
   .mVideo_iFrame_HolyNight {
      width: 380px;
      height: 227px;
   }

}





