@media screen and (max-width:1010px){
    .yiyan{
        bottom:100px
    }
}
@media screen and (max-width:830px){
    button#search-btn{
        width:10%!important
    }
    #search{
        width:95%!important
    }
    #search-box .s-key{
        width:90%!important
    }
    div#box{
        width:100%!important
    }
    .space-tips{
        width:100%!important;
        margin:0 10px 0 -10px!important
    }
}
@media screen and (max-width:745px){
    div.Search>div[data-v-0b1f3c5b]{
        width:95%
    }
    div.Search>div>div[data-v-0b1f3c5b]{
        width:85%
    }
    div.Search>div>button[data-v-0b1f3c5b]{
        width:70px
    }
}
@media screen and (max-width:504px){
    .CommonSite>nav>a{
        width:25%
    }
    .CommonSite>nav>div.add{
        width:25%
    }
}
@media screen and (max-width:400px){
    div.Search>div>div[data-v-0b1f3c5b]{
        width:80%
    }
}
@media screen and (max-width:360px){
    div.Search>div>div[data-v-0b1f3c5b]{
        width:75%
    }
    div.Search>div[data-v-0b1f3c5b]{
        margin-left:5%;
        margin-right:5%
    }
    div#settingpage{
        width:85%
    }
}
@media screen and (max-width:280px){
    div.Search>div>button[data-v-0b1f3c5b]{
        width:55px
    }
}
/*高*/
 @media screen and (max-height:690px){
    .di{
        font-size:0
    }
}
/**防选中**/
 html,body,footer,table,iframe,div,li,ul,button,a,i,em,b,img,h1,h2,h3,dd{
    margin:0;
    padding:0;
    border:0;
    -moz-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    -khtml-user-select:none;
    user-select:none;
    -webkit-touch-callout:none;
}
/**字体**/
 @font-face{
    font-family:iconfont;
    src:url("fonts/font.woff");
    format('woff')
}

 @font-face{
    font-family:myfont;
    src:url("fonts/Roboto-Medium.ttf");
    format('turetype')
}

 @font-face{
    font-family:pf;
    src:url("fonts/pingfang-regular.ttf");
    format('turetype')
}

.time{
font-family:myfont;
}

body{
font-family:pf;
}

.weather{
    font-family: cursive;
}

.iconfont{
    font-family:iconfont!important;
    font-size:16px;
    font-style:normal;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}
.iconfont{
    font-family:iconfont!important
}
/**设置按钮**/
 set-btn-icon{
     width:30px;
     height:30px;
}
/**搜索**/
 html,body,footer,table,iframe,div,li,ul,button,a,i,em,b,img,h1,h2,h3,dd {
     margin:0;
     padding:0;
     border:0;
}
 #search {
     position:relative;
     width:820px;
     margin:10px auto 0 auto;
     height:50px;
     border-radius:10px;
     line-height:50px;
     z-index:3 
}
 #search-box .search-icon {
     position:absolute;
     left:13px;
     top:13px;
     width:25px;
     height:25px;
     overflow:hidden;
     cursor:default;
     background-size:cover;
     -webkit-background-size:cover;
     -o-background-size:cover;
}
 #search-box .s-key {
     box-sizing:border-box;
     float:left;
     padding:2px 10px 2px 50px;
     height:50px;
     width:750px;
     font-size:16px;
     border:none;
     outline:none;
     border-radius:10px 0 0 10px;
     backdrop-filter:blur(10px);
}
 #search-box .s-btn {
     float:left;
     width:50px;
     height:50px;
     border:none;
     outline:none;
     border-radius:0 10px 10px 0;
     cursor:default;
     backdrop-filter:blur(10px);
     text-align:center;
}
 button#search-btn {
     height:50px;
     width:70px;
     border:0;
     backdrop-filter:blur(10px);
     border-radius:0 10px 10px 0;
     font-size:25px;
     cursor:pointer;
}
 .search-hot-text {
     position:absolute;
     top:60px;
     z-index:100;
     width:820px;
     border-radius:10px;
     border-top:none;
     backdrop-filter:blur(10px);
     overflow:hidden;
}
 .search-hot-text .space-line {
     width:776px;
     height:1px;
     margin:9px auto 0 auto;
}
 .search-hot-text ul {
     margin:0;
     padding:5px 0 5px 0 
}
 .search-hot-text li {
     line-height:35px;
     font-size:14px;
     padding:0 20px;
     cursor:default;
}
 .search-hot-text li i {
     margin-right:5px 
}
 .search-hot-text li:hover {
     cursor:default;
     transition:all .3s;
     animation-name:flash;
}
 .search-hot-text .space-tips {
     width:776px;
     line-height:30px;
     font-size:14px;
     margin:9px auto 0 auto 
}
 .space-tips .offHistory {
     float:right;
     cursor:default;
}
 .search-engine {
     position:fixed;
     margin-top:6px;
     width:250px;
     height:320px;
     padding:15px 0 0 15px;
     border-radius:4px;
     transition:all 0.3s;
     -moz-transition:all 0.3s;
     -webkit-transition:all 0.3s;
     -o-transition:all 0.3s;
     display:none;
     backdrop-filter:blur(10px);
     z-index:3 
}
 .search-engine ul::before {
     content:'';
     width:0;
     height:0;
     position:absolute;
     top:-15px;
     border-top:7px solid transparent;
     border-right:8px solid transparent;
     border-left:8px solid transparent;
}
 .search-engine ul {
     display:flex;
     flex-direction:column;
     flex-wrap:wrap;
     height:318px 
}
 .search-engine-list::after {
     content:'';
     width:90px;
     height:20px;
     position:absolute;
     top:-20px;
     left:1px 
}
 .search-engine-list li {
     width:90px;
     line-height:24px;
     font-size:14px;
     padding:6px 10px 6px 10px;
     margin:0 8px 8px 0;
     cursor:pointer;
}
 .search-engine-list li:hover {
     border-radius:5px;
     transition:all .3s;
     animation-name:flash;
}
 .search-engine-list li span {
     width:20px;
     height:20px;
     float:left;
     margin-right:5px;
     margin-top:2px;
     background-size:100% 100%;
     -webkit-background-size:100% 100%;
     -o-background-size:100% 100%;
}
 ::marker {
     font-size:0 !important;
     color:rgb(0,0,0,0) !important;
    /**统一去除**/
     display:none;
}
 .fa-clock:before {
     content:url('fonts/dot.svg');
     font-size:20px;
     padding-top:5px;
}
 .backg {
     transition:all 350ms linear;
}
 .lm-animated-bg {
     position:fixed;
     width:auto;
     height:auto;
     top:-28px;
     left:-28px;
     right:-28px;
     bottom:-28px;
     background-position:center center;
     background-size:cover;
     background-repeat:no-repeat;
     z-index:-1 
}
/**天气**/
 div#weather {
     margin:0;
     padding:0;
     padding-left:6px;
     transition:all 350ms linear;
}
 div#weather>div>div.info {
     font-weight:300;
     opacity:1;
     transition:all 1s linear;
}
 div#weather>div>div.info>.weather {
     margin-top:20px;
     display:flex;
     align-items:center;
     margin-left:9px;
     height:32px;
}
 div#weather>div>div.info>.weather>.weather-icon {
     display:none;
     width:32px;
     height:32px;
     margin-right:15px;
}
 div#weather>div>div.info>.weather>.temp {
     display:none;
     font-size:32px;
     line-height:32px;
     height:32px;
     cursor:default;
}
/**时间**/
 .time {
     transition:all 350ms linear;
     height:150px;
}
 .clock-container {
     display:flex;
     align-items:center;
     position:absolute;
     left:50%;
     top:150px;
     transform:translate(-50%,-50%);
}
 .clock-container p {
     font-size:50px;
     font-weight:100;
}
 .colon {
     --size:4px;
     width:var(--size);
     height:15px;
     position:relative;
     margin-left:10px;
     margin-right:10px;
}
 .colon::before {
     content:'';
     width:100%;
     height:var(--size);
     position:absolute;
     top:0;
     left:0;
     border-radius:50%;
}
 .colon::after {
     content:'';
     width:100%;
     height:var(--size);
     position:absolute;
     bottom:0;
     left:0;
     border-radius:50%;
}
/**一言**/
 .yiyan {
     transition:all 350ms linear;
     position:absolute;
     left:0;
     right:0;
     bottom:130px;
}
 div#hitokoto_data {
     font-size:0px;
}
 div#hitokoto {
     text-align:center;
     cursor:default;
}
/**自定义背景控件**/
 div#setbg {
     position:fixed;
     backdrop-filter:blur(10px);
     height:100%;
     width:100%;
     top:0;
     bottom:0;
     left:0;
     right:0;
     transition:all .3s;
     z-index:9 
}
 div#settingpage {
     position:fixed;
     margin:auto;
     padding:10px;
     backdrop-filter:blur(10px);
     border-radius:10px;
     height:230px;
     width:300px;
     top:0;
     bottom:0;
     left:0;
     right:0;
     transition:all .3s;
     box-shadow:0 0 20px 10px rgb(0 0 0 / 10%);
     z-index:10 
}
 input#backimg {
     width:100%;
     border-radius:5px;
     border-bottom:1px solid grey;
     margin-top:3%;
     display:block;
     height:15%;
     -webkit-box-sizing:border-box;
     font-size:12px;
     padding:0 8px;
     outline:none;
}
 div#bgb {
     display:-webkit-box;
     display:-ms-flexbox;
     display:flex;
     margin-top:15px;
}
 button#save-backimg,#save-backimg64,#start {
     flex:1 1 0;
     border-radius:5px;
     cursor:pointer;
     height:24px;
}
 button#close-set {
     -webkit-box-flex:1;
     -ms-flex:1 1 0px;
     flex:1 1 0;
     height:24px;
     font-size:12px;
     cursor:default;
     border-radius:5px;
     cursor:pointer;
}
 button#close-yj {
     -webkit-box-flex:1;
     -ms-flex:1 1 0px;
     flex:1 1 0;
     height:24px;
     font-size:12px;
     cursor:default;
     border-radius:5px;
     cursor:pointer;
}
/**页脚**/
 .foot {
     transition:all 350ms linear;
     width:100%;
     height:20px;
     margin:auto;
     display:flex;
     justify-content:center;
     align-items:center;
     left:0;
     right:0;
     bottom:10px;
     position:absolute;
     font-size:12px;
     cursor:pointer 
}
/**本地壁纸 base64**/
 div#settingpage2 {
     position:fixed;
     margin:auto;
     padding:10px;
     backdrop-filter:blur(10px);
     border-radius:10px;
     height:230px;
     width:300px;
     top:0;
     bottom:0;
     left:0;
     right:0;
     transition:all .3s;
     box-shadow:0 0 20px 10px rgb(0 0 0 / 10%);
     z-index:11 
}
 button#local-bg {
     flex:1 1 0;
     border-radius:5px;
     cursor:pointer;
     height:24px;
}
 buttom#mainbg {
     position:fixed;
     height:24px;
     width:94%;
     border-radius:5px;
}
 .setlocalbg {
     position:relative;
     left:0;
     right:0;
     bottom:0;
     margin:auto;
     bottom:-100px;
}
 img#imgShow {
     width:145px;
     height:85px;
     position:fixed;
     left:0;
     right:0;
     top:0;
     border:0;
     bottom:87px;
     margin:auto;
     background-repeat:no-repeat;
     background-size:100% 100%;
     border-radius:5px;
     opacity:1;
}
 button#close-localbg {
     position:fixed;
     left:0;
     right:0;
     top:200px;
     bottom:0;
     margin:auto;
     -webkit-box-flex:1;
     -ms-flex:1 1 0px;
     flex:1 1 0;
     height:24px;
     font-size:12px;
     cursor:default;
     border-radius:5px;
     cursor:pointer;
}
/**链接**/
 .bottom-row-add {
     position:fixed;
     margin:auto;
     padding:10px;
     backdrop-filter:blur(10px);
     border-radius:10px;
     height:230px;
     width:300px;
     top:0;
     bottom:0;
     left:0;
     right:0;
     transition:all .3s;
     box-shadow:0 0 20px 10px rgb(0 0 0 / 10%);
     z-index:11;
}
 .drawers{
     transition:all 350ms linear;
     padding-top: 30px;
     margin-bottom: 5%;
}
 #commonly-use-url{
     display: flex;
     width: 70%;
     flex-wrap: wrap;
     justify-content:center;
     margin: 0 auto;
}
 #commonly-use-url a{
     text-decoration: none;
}
 .url-icon{
     width: 100px;
     border-radius: 10px;
     display: flex;
     flex-direction: column;
     align-items: center;
     transition: all 0.2s;
     position: relative;
     letter-spacing:1px;
     margin: 0 15px;
}
 .url-icon:hover{
     backdrop-filter: blur(10px);
}
 .icon {
     display: flex;
     justify-content: center;
     margin-top: 10px;
     margin-bottom: 5px;
     width: 50px;
     height: 50px;
     border-radius: 25px;
     align-items: center;
}
 .icon img{
     height: 25px;
     width: 25px;
}
 .url-title {
     width: 90px;
     overflow: hidden;
     text-align: center;
     white-space: nowrap;
     text-overflow: ellipsis;
     cursor: pointer;
     margin-bottom:10px;
}
 .del-icon{
     align-items: center;
     border-radius: 4px;
     display: flex;
     height: 28px;
     justify-content: center;
     padding-inline-start: var(--cr-icon-button-icon-start-offset);
     position: absolute;
     width: 28px;
     right: 4px;
     top: 4px;
     opacity: 0;
     transition: .3s;
}
 .del-icon:hover{
     opacity: 1;
}
 .maskedImage{
     height: 24px;
     width: 24px;
}
 .add-url-title{
     width: 80px;
}
 .add-url{
     width: 160px;
}
 .input {
     border: 0;
     border-bottom: 2px solid rgb(185, 169, 169);
     line-height: 1.2;
     font-weight: 500;
     outline: none;
     text-align: center;
     margin:0 10px 0 10px;
}
 button#show-Add {
     background-color:#0e6ec6;
     color:#fff;
     flex:1 1 0;
     border-radius:5px;
     cursor:pointer;
     height:24px;
}
 button#addUrl {
     background-color:#0e6ec6;
     color:#fff;
     flex:1 1 0;
     border-radius:5px;
     cursor:pointer;
     height:24px;
     margin-right:5px;
}
 button#close-Url {
     background-color:#0e6ec6;
     color:#fff;
     flex:1 1 0;
     border-radius:5px;
     cursor:pointer;
     height:24px;
     margin-left:5px;
}
 input#title {
     width:100%;
     border-radius:5px;
     margin:0;
     display:block;
     height:15%;
     -webkit-box-sizing:border-box;
     font-size:12px;
     padding:0 8px;
     outline:none;
     margin: 10px 0;
}
 input#url {
     width:100%;
     border-radius:5px;
     margin:0;
     display:block;
     height:15%;
     -webkit-box-sizing:border-box;
     font-size:12px;
     padding:0 8px;
     outline:none;
     margin: 10px 0;
     margin-bottom: 30px;
}
/*链接收藏*/
 .hide {
     opacity: 0;
     visibility:hidden;
     transition: all 200ms linear !important;
}
 .linkis{
     transition: all 200ms linear;
}
 .mylinks{
     display:flex;
     margin-left:70%;
}
 img.mylinksbtn{
     padding:6px;
     margin:10px;
     border-radius:20px;
}
 .isclosed{
     transform: rotate(180deg);
}
 img.mylinksbtn:hover{
     transition: all 0.2s;
     backdrop-filter: blur(10px);
}