head,body {
    margin:0;padding:0;
}
body{
    width:100%;margin: 0 auto;
    background-color: blanchedalmond;
}
#head {
width: 100%;
height:calc(100vw*0.30);
background: url(asets/header.jpg);
background-size:cover;
background-position: 50% 30%;
}
#main{width:100%;margin: 1.5em auto;margin-top: 1em;position: relative;}
#lks{font-size:1.4em;color:#333;margin:1em;}
#lks a{text-decoration: none;color:#B05020;}
#conts{background-color: #eeeae3;margin:10em 0;padding:1em;transition:margin 1s ease;box-sizing: border-box;
    box-shadow: 0 0 6px 3px rgba(128, 64, 88, 0.3);}

    #conts.up{
        margin:2em 0;
    }

    #conts a {width:100%;display: block;text-align:center;position: relative;}
    #conts a img{max-height:1000px;width:auto;max-width:100%;margin:1.5em auto;}

    #conts a div{width:96px;height:96px;top:50%;left:50%;transform:translate(-50%,-50%);position: absolute;display: none;}
    #conts a:hover div{display:block;background-image: url(asets/diconx1.png);background-repeat: no-repeat;}
   
    #conts::after,#list::after{content: "";clear: both;display:block;}
   
    #main #tip1{display:none;z-index:100;position: fixed;
        top:300px;width:300px;height:60px;left:50%;transform:translatex(-50%);
        background-image: url(asets/poptip.png);background-size: contain;}
    #main #tip1.show{display:block;}

    div.month {margin:4%;width:40%;height:calc(90vw);overflow:hidden;
        background:silver;background-size:cover; float:left;
        position: relative;
    }
    .month a{width:100%;height:100%;display: block;}
    .month a div{display:block;width:6em;height:3.4em;top:1em;font-size: 1.4em;text-align: center;
        box-sizing:border-box;padding:1em;border-bottom-right-radius:0.6em;box-shadow: 0 0 2px gold;
        background-color: rgba(64,64,64,0.8);color:#eee;}
    
    #foot{
    margin-top: 0;
    text-align: center;
    background-color: rgba(161, 47,47,0.8);
    color:rgb(174,221,129);
    line-height: 1.2em;
    padding: 1em 0;
    font-size: 1em;
}
#foot a{color:#fe3;}