html, body { margin: 0; padding: 0; }
.content { position: relative; width: 1200px; margin: 0 auto; }
.wrapper { position: relative; width: 800px; height: 450px; background: #000; }
#video { position: relative; max-height: 100%; max-width: 100%; display: block; margin: 0 auto; }
.setting-box { position: absolute; right: 0px; width: 400px; height: auto; top: 0px; z-index: 2000; }
.setting-list { position: relative; height: auto; padding: 10px 0px; padding-left: 22px; }
div[data-status="hide"] { display: none; }
.setting-header { background: #00CFE6; color: #fff; }
select { position: relative; height: 30px; width: 160px; outline: none; margin-left: 20px; }
.setting-content { position: relative; height: auto; }
.setting-item { position: relative; height: auto; padding: 8px 0px; }
input { height: 26px; text-indent: 10px; }
.effect-list { position: relative; height: auto; }
.effect-content { position: relative; margin-top: 10px; }
.effect-item { position: relative; margin-bottom: 6px; }
.inline-input { width: 55px; text-indent: 4px; }
button { width: 100px; height: 40px; border: none; outline: none; background: #00CFE6; color: #fff; margin-bottom: 10px; }
button:hover { cursor: pointer; opacity: 0.9; }
#useGradient { height: auto; }