html,body{ background:#f4f4f4; } .panel{ width:100%; height:10%; background:black; } .panel video { width: 100%; border: 0; vertical-align: bottom; } .stackpanel-horizontal { display: flex; flex-wrap: wrap; flex-direction: row; } #content { position: relative; } .btngroup { padding: 1rem 1.2rem; display: none; width: 100%; background-color: #fff; position: absolute; top: 3rem; left: 0; z-index: 10; } .btn { border: 1px solid #d9d9d9; border-radius: 0.25rem; /* height: 2.4rem; */ /* width: 6rem; */ line-height: 2.4rem; color: #000000; font-size: 0.8rem; margin: 0 0.2rem 0.5rem 0.2rem; } .btn-free-width { border: 1px solid #d9d9d9; border-radius: 0.25rem; height: 2.4rem; line-height: 2.4rem; color: #000000; min-width: 23%; font-size: 0.8rem; margin: 0 0.2rem 1.25rem 0.2rem; padding:0 0.4rem; box-sizing: border-box; } /*.btn-free-width:nth-child(4n+4){ margin: 0 0rem 1.25rem 0; }*/ .btn-highlight { color: #eabe2a; border: 1px solid #eabe2a; } .btns-container { padding: 0.5rem 1rem 0 1rem; } .btns-title { font-size: 1.2rem; } .circuit-content { width: 100%; /* height: 100%; */ } #circuit-selector { display: flex; justify-content: space-between; align-items: center; background-color: #eabe2a; height: 3rem; width: 100%; line-height: 3rem; padding: 0 1rem; margin-top: 0.4rem; box-sizing: border-box; } #circuit-selector img, #circuit-selector span { vertical-align: middle; } #circuit-selector img { width: 1rem; /* height: 1rem; */ }