@font-face {
    font-family: "andalemo";
    src: url("fonts/ANDALEMO.TTF") format("truetype");
}

body {
    max-width: 100%;
    overflow-x: hidden;
    background: #161616;
    font-family: "andalemo";
}

*:hover {
    text-decoration: none!important;
}

*:focus {
    outline: none!important;
}

/*nav start*/
.logo_cont {
    width: 59px;
    display: inline-block;
}

.logo_cont img {
    width: 100%;
}

.nav_inner {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 50px;
    margin-top: 26px;
}

.close_nav {
    display: none;
}

.nav_outer {
    display: inline-block;
    float: right;
    margin-top: 22px;
}

.nav_outer ul {
    padding-left: 0;
    list-style: none;
    text-align: right;
}

.nav_outer li {
    font-size: 17px;
    display: inline-block;
    margin: 0px 8px;
    color: #e3bf89;
    font-family: 'Baskervville', serif;
}

.nav_outer li a {
    color: unset;
}

.nav_outer li.close_nav {
    display: none;
}

button.open_nav {
    display: none;
}

.body_painting .nav_outer li {
    color: #000000;
}

/*nav end*/
body.body_music {
    background: url(../img/background.jpg);
    margin: 0;
    padding: 0;
    user-select: none;
    height: 100vh;
	max-width:100%;
}

.music_cont {
    /*background: url(../img/background.jpg);*/
    width: 100%;
    /*height: 100vh;*/
    margin: 0 auto;
    background-size: cover;
    background-repeat: repeat-x;
}

body.body_music .nav_outer li {
    font-style: italic;
    color: black;
}

.middle_section {
    width: 23%;
    margin: 0 auto;
    position: absolute;
    bottom: 0;
    max-width: 315px;
    left: 38%;
}
.music_list>img {
    cursor: pointer;
}
.middle_section img {
    width: 100%;
}

.music_list_cont {
    position: relative;
    width: 341px;
    /* overflow-y: hidden; */
    /* background: #ccc; */
    float: right;
    overflow-x: hidden;
    margin-top: 35vh;
}

.music_list {
    width: 100%;
    position: relative;
    /* margin-top: 40vh; */
    position: relative;
    display: block;
    float: left;
}

.pay_pause {
    width: 46px;
    margin-top: 8px;
    display: inline-block;
    margin-bottom: 5px;
}

.pay_pause.play {
    display: inline-block;
}

.pay_pause.pause {
    display: none;
}

.music_list_cont span {
    font-size: 18px;
    display: inline-block;
    margin-left: 16px;
}

.music_list_cont audio {
    display: none;
}

.music_list:before {
    position: absolute;
    content: '';
    bottom: 0;
    width: 80%;
    height: 2px;
    background: #0000004f;
    right: 0;
}

.mmusic_wrapper {
    position: relative;
    width: 105%;
    /* background: green; */
    float: left;
    height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
}

.heading_music_right {
    width: 83%;
    /* background: red; */
    margin-bottom: 0;
    display: block;
    float: right;
    border-bottom: 5px solid black;
}

.heading_music_right p {
    font-size: 20px;
    margin: 10px 0px 5px;
}

.right_section {
    position: relative;
    min-width: 269px;
    /* overflow-y: hidden; */
    /* background: #ccc; */
    float: left;
    margin-top: 30vh;
}

.now_playing {
    display: inline-block;
    /* background: red; */
    font-size: 19px;
    transform: translateY(41px);
    padding-right: 79px;
    border-bottom: 2px solid black;
    padding-bottom: 5px;
    padding-left: 10px;
}

.song_info {
    height: 200px;
    /* background: green; */
    padding-top: 49px;
    border-left: 2px solid #000000c9;
    margin-left: 151px;
}

.Song_name {
    display: block;
    margin-left: 17px;
    font-size: 30px;
    text-transform: uppercase;
    margin-right: 20px;
    margin-bottom: 10px;
}

.Song_singer {
    display: block;
    margin-left: 17px;
    font-size: 18px;
    margin-bottom: 7px;
}

.Song_album {
    display: block;
    margin-left: 17px;
    font-size: 18px;
}

.song_info > hr {
    border-top: 2px solid #000000c9;
}

.playing .play {
    display: none!important;
}

.playing .pause {
    display: inline-block;
}

.decore_overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    /* background: red; */
    left: 0;
    overflow: hidden;
    z-index: -1;
}

.cloud_1 {
    width: 36%;
    position: absolute;
    top: 14%;
    right: 19%;
}

.cloud_2 {
    width: 26%;
    position: absolute;
    top: 27%;
    left: -14%;
}

.cloud_3 {
    width: 5%;
    position: absolute;
    top: 58%;
    left: 25%;
}

.decore_overlay img {
    width: 100%;
}

.cassate{
    width: 25%;
    position: absolute;
    top: 12vh;
    filter: brightness(0.5);
    right: 13vh;
}
.music_footer {
    display: block;
    text-align: left;
    color: white;
    width: 100%;
    max-width: 1151px;
    margin: 0 auto;
}
.music_footer a{
    color: white;
}
@media only screen and (max-width: 900px) and (min-width: 300px){
    .music_footer {
    display: block;
    text-align: center;
    color: white;
    width: 100%;
    max-width: 1151px;
    margin: -13px auto;
}
    .mmusic_wrapper {
        overflow-y: auto;
        height: 200px!important;
    }
}