body { background-color: rgb(62, 50, 64); } .parent { width: 100%; height: 100%; position: fixed; top: 0; background: url(/pic/bg.jpg) no-repeat center center / cover; left: 0; display: flex; align-items: center; align-content: center; justify-content: left; overflow: auto; } #RadioBox{ width: 450px; height: 100%; background-color: rgba(60, 60, 60, 0.9); /* border-radius: 10px; */ padding: 0 5px; color: #fff; } .tagBOX{ width: 410px; height: 150px; } .tagA { width: 100%; height: 20px; border-radius: 5px 5px 0 0; border: #f54e4e; background-color: #000; color: #fff; transition: 0.5s ease all; outline: none; cursor: pointer; text-align: center; margin-left: auto; margin-right: auto } .tagA:hover { color: #000; background-color: #fff; } .tagB { width: 100%; /* height: 20px; */ border-radius: 0 0 5px 5px; border: #f54e4e; background-color: #fff; color: #000; transition: 0.5s ease all; outline: none; text-align: center; margin-left: auto; margin-right: auto } h1::before { content: ''; display: inline-block; margin:0 10px; width: 25px; height: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; background: red; animation: blink 3s linear infinite; } @keyframes blink{ 0%{opacity: 0;} 25%{opacity: .5;} 50%{opacity: 1;} 75%{opacity: .5;} 100%{opacity: 0;} } h1 { text-align: center float:left; margin:10px 50px; } .btn { width: 100px; height: 60px; border-radius: 5px; border: #f54e4e; background-color: #000; color: #fff; transition: 0.5s ease all; outline: none; cursor: pointer; text-align: center; margin: auto; justify-content : center; } .btn:hover { color: #000; background-color: #fff; } .btn-wrap { margin: auto; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .mute_btn { width: 30px; height: 30px; border-radius: 5px; border: #f54e4e; background-color: #000; color: #fff; transition: 0.5s ease all; outline: none; cursor: pointer; text-align: center; margin-right: 10px; //margin: auto; } .mute_btn:hover { color: #000; background-color: #fff; } .volume-wrap { align-items: center; justify-content: center; display: flex; } .tcon { width: 100%; border-radius: 5px 5px 0 0; border: #f54e4e; background-color: #000; color: #fff; transition: 0.5s ease all; outline: none; text-align: center; margin-left: auto; margin-right: auto; } .tlist { width: 100%; height: 35%; border-radius: 0 0 5px 5px; border: #f54e4e; background-color: #fff; color: #000; transition: 0.5s ease all; outline: none; text-align: center; margin-left: auto; margin-right: auto; overflow: auto; } .list_el { border-bottom: 2px double #000; background-color: #d3d3d3; color: #000; } .list_el:nth-child(odd) { border-bottom: 2px double #000; background-color: #fff; color: #000; } DIV { text-align: center }