@charset "utf-8";

html { height: 100%; }

body.普通主体 { width: 100%; height: 100%; display: flex; flex-direction: column; margin: 0px; overflow: hidden; }

main.普通主区 { display: flex; flex: 1; overflow: hidden; }

article.普通文章 { flex: 1; background: linear-gradient(#aaa, #bbb, #aaa); }

aside.普通侧边 { background: linear-gradient(#ccc, #ddd, #ccc);; display: flex; flex-direction: column; overflow: hidden; padding: 5px; }

iframe.主要框架 { border: none; width: 100%; height: 100%; }

form.搜索表单 { position: relative; }

input.搜索输入 { width: calc(100% - 10px); border: none; outline: none; padding: 5px 5px 5px 25px; margin: 5px; border-radius: 10px; background: white url(文件夹/搜索.svg) no-repeat 5px /15px; font-size: 12px; color: gray; -webkit-appearance: none; }

input.提交输入::-webkit-search-cancel-button { display: none; }

input.提交输入 { position: absolute; right: 10px; top: 50%; font-size: 12px; padding: 0 5px; transform: translateY(-50%); color: gray; background: #eee; border: none; outline: none; border-radius: 10px; }

ul.展示列表 { flex: 1; display: flex; flex-direction: column; list-style: none; margin: 0 5px; padding: 0; overflow: hidden scroll; }

ul.展示列表::-webkit-scrollbar { display: none; }

div.分隔分区 { text-align: center; }

div.建议搜索分区 { position: absolute; top: 29px; background: white; margin: 0 45px 0 25px; z-index: 50; box-shadow: 0 2px 2px 0px #888; width: calc(100% - 70px); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }

li.展示项目 { display: flex; align-items: center; list-style: none; background: white; border-radius: 10px; padding: 5px; margin: 1px 0; cursor: default; position: relative; opacity: 0.6; }

li.展示项目:hover { opacity: 1; }

img.展示图片 { font-size: 12px; width: 15px; height: 15px; object-fit: cover; }

img.加载中图片 { width: 15px; margin: auto; }

img.播放中图片 { filter: invert(100%); position: absolute; right: 10px; width: 8px; }

img.搜索输入图片 { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; width: 15px; height: 15px; object-fit: contain; }

p.展示段落 { margin: 0 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }

p.建议搜索段落 { margin: 0; padding: 5px; font-size: 12px; cursor: default; color: gray; }

p.建议搜索段落:hover { background: rgb(221 221 221 / 50%); }

p.提示段落 { position: fixed; z-index: 1000; top: 50%; left: 50%; background: #4c4c4c; color: rgba(255,255,255,0.9); transform: translate(-50%,-50%); padding: 5px; border-radius: 12px; margin: 0; font-size: 12px; box-shadow: 0 0 5px 1px rgb(0 0 0 / 50%); }

a.内部链接 { color: gray; font-size: 12px; text-decoration: none; }


@media (max-width: 767.9px) {
    main.普通主区 { flex-direction: column; }
    aside.普通侧边 { flex: 1; }
}

@media (min-width: 768px) {
    main.普通主区 { flex-direction: row; }
    aside.普通侧边 { width: 200px; }
}