@import url(../valueINITbase.css);


#_id_frame {
    grid-area: frame;
    padding: 0;
    margin: 0;
    width: 100%; 
    height: 750px; 
    background-color: black; 
    color: white; 
    overflow-y: scroll;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

pre {
    white-space: pre-wrap;
    word-wrap: break-word;
}
  
._c_poems {
    word-break: break-word;
}

._c_Apple-Music-Video-back-button {
    grid-area: center-lt;
}

._c_Apple-Music-Video-refresh-button {
    grid-area: center;
    padding: 0;
    margin: 0;
}

._c_Apple-Music-Video-forward-button {
    grid-area: center-rt;
    padding: 0;
    margin: 0;
}

._c_Apple-Music-Video-alphabet-buttons-left {
    grid-area: left;
    display: inline-flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: flex-end;
    }



._c_Apple-Music-Video-alphabet-buttons-right {
    grid-area: right;
    display: inline-flex;
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: flex-start;

}

#_id_Good-News {
    grid-area: GoodNews;
}

._c_Apple-Music-grid-buttons {
    grid-area: _c_Apple-buttons ;
}

._c_Apple-Music-grid {
    display: grid;
    justify-content: flex-start;
    align-items: end;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: auto;
    grid-column-gap: 0px;
    grid-row-gap: 0px;

    grid-template-areas: 
     'left _c_header _c_header _c_header _c_header _c_header _c_header right' 
        'left frame frame frame frame frame frame right'
        'left frame frame frame frame frame frame right'
        'left frame frame frame frame frame frame right'
        'left GoodNews GoodNews GoodNews GoodNews GoodNews GoodNews right'
        '_c_Apple-buttons _c_Apple-buttons _c_Apple-buttons _c_Apple-buttons _c_Apple-buttons _c_Apple-buttons _c_Apple-buttons _c_Apple-buttons' ;
}


button {
    border: 3px solid green;
    /* padding: 0;
    margin: 0;
    height: auto; */
}

._c_header {
    grid-area: _c_header;
}

#_id_GoOnlineDj-Websites {
 text-align: center;
    padding: 0.1rem;
    margin: 0;
}

._c_MJW-contact {
    padding: 0.1rem;
    margin: 0 auto;
}




.main-grid {
    color: blue;
}


._c_Apple-Music-grid-buttons  ._c_Scroll-Up {
    animation: flash-blue 1s infinite alternate;
}

._c_Apple-Music-grid-buttons ._c_Scroll-Down {
    animation: flash-red 1s infinite alternate;
}


@keyframes flash-blue {
    0% {
        background-color: white;
    }
    100% {
        background-color: blue;
    }
}

@keyframes flash-red {
    0% {
        background-color: white;
    }
    100% {
        background-color: red;
    }
}

@keyframes flash-green {
    0% {
        background-color: white;
    }
    100% {
        background-color: green;
    }
}



/* This is the end of the CSS file for the Apple Music Video page layout. 
   It defines the grid structure, styles for buttons, and other elements 
   to create a responsive and visually appealing interface. */