/*************************************************手**机**兼**容*************************************************/



@media (max-width: 600px){

    /* html{
        min-height: 100%;
        min-width: 100%;
        filter: grayscale(100%) saturate(.8);
        -webkit-filter: grayscale(100%);
    } */

            /* 全站灰色滤镜  以备不时之需 */
        /* 滤镜      灰色指数      饱和度 */
        /* -o-       Presto内核   兼容 Opera 浏览器 */
        /* -ms-      Trident内核  兼容 Edge 浏览器 */
        /* -moz-     Gecko内核    兼容 Firefox 浏览器 */
        /* -webkit-  webkit内核   兼容 Safari & Chrome 浏览器 */

    


    #wallpaper{
        /* background-color: #000; */
        background-image: url(../img/wallpaper/Pikachu.jpeg);                                    /* 本地壁纸 */
        /* background-image: url(https://www.todaybing.com/api/today/cn); */                      /* 必应壁纸 */
        /* background-image: url(https://cdn.jsdelivr.net/gh/fishol/wallpaper/Pikachu.jpeg); */   /* 外链壁纸 */
        background-size: cover;             /* 背景全覆盖 */
        background-repeat: no-repeat;       /* 背景不重复 */
        background-attachment: fixed;       /* 背景固定 壁纸图片不会随着页面的滚动而滚动 */
        background-position: center;        /* 背景居中定位 */ 

        position: fixed;

        min-height: 100vh;
        min-width: 100vw;

    }

    #weather{             /* 天气 */  
        display: none;    /* 放哪都不合适 先删掉 */
    }

    #open,#close,#sidebar{ /* 侧栏导航 */
        display: none;     /* 不会改 先删掉 */
    }


    #main{                  /* 为啥手机端不让选from呢 */
        position: fixed; 
        width: 400px;
        height: 370px;
        top: -68px;          /* 水平居中 + 垂直居中 */
    }

    #main > #logo{
        /* display: none; */
        position: absolute;
        width: 250PX;
        height: 75px;
    }

    #search{                          /* 搜索框 */
        position: absolute;
        width: 380px;                 /* search宽 = input宽 + input左右缩进 */
        height: 46px;                 /* input高 = search高 */
        border-radius: 50px;          /* 搜索框左右圆角 */
        border: 1px solid #d4d4d4;     /* 默认边框颜色 */
        transition: all .3s ease-in;
    }

    .icon-google,.icon-baidu,.icon-search{
        z-index: 800;
        position: absolute;
        width: 30px;
        height: 30px;
        font-size: 30px;
    }

    #search input{
        width: 290px;
        height: 46px;
        text-align: center;             /* 输入框文字居中 */
        font-size: 27px;
        padding-left: 45px;             /* margin外边距  padding内边距 */
        padding-right: 45px;            /* 增加内边距 也可以当左右缩进 */
        border: none;                   /* 输入框无边框 */
        outline: medium;                /* 选中后也无边框 */
        border-radius: 50px;            /* 输入框左右圆角 */
        background-color: transparent;  /* 透明色 */ 
        color: #ddd;                  /* #d4d4d4  #5F6368 输入时的文字的颜色 */
    }

    input:-moz-placeholder,             /* 输入框placeholder值默认颜色 兼容Firefox */
    textarea:-moz-placeholder {
    color: #ddd;
    }
    input:-ms-input-placeholder,        /* 输入框placeholder值默认颜色 兼容Edge */
    textarea:-ms-input-placeholder {
    color: #ddd;
    }
    input::-webkit-input-placeholder,   /* 输入框placeholder值默认颜色 兼容Chrome Safari */
    textarea::-webkit-input-placeholder {
    color: #ddd;
    } 

    #search input:focus{                                  /* 输入时背景变色 */
        /* background-color: #fff; */                     /* 纯白色 */
        background-color: rgba(0, 0, 0, 0.3);           /* 透明黑 如果只加模糊 在浅色背景下字不明显 */
        backdrop-filter: blur(7px) saturate(.7);          /* 模糊 饱和度 */
        -webkit-backdrop-filter: blur(7px) saturate(.7);  /* webkit内核 兼容 Safari & Chrome 浏览器 */
        position: fixed;
    }

    #buy{
        display: none;
    }

    #footer{                  /* 底部版权 */
        position: fixed;
        width: 300px;
        display: table;
        height: 20px;
        line-height: 20px;    /* 行高与高度一致时垂直居中 */ 
        bottom: 10px;
        text-align: center;   /* 水平居中 */
        font-size: 15px;      /* 字体大小 */
        font-family: Helvetica, Arial, sans-serif;    /* 字体样式 */
        color: #ddd;
    }

    #footer > a{
        color: #ddd;
    }


}