::-moz-selection { color: #fff; background: #AB47BC; }
::selection { color: #fff; background: #AB47BC; }

* {box-sizing: border-box;}
body {
    font-family: 'Montserrat Alternates', sans-serif;
    background-color: #fafafa;
    padding: 0;
    margin: 0;
}
iframe { border: none; }
h1 { text-align: center; font-size: 50px; }
/* day */
.day {
    width: 100%;
    height: 100px;
    background: #000;
    color: #fff;
    display: flex;
    align-items: center;
    position: relative;
}
.day::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 6px;
    background: rgba(255,255,255,0.3);
    bottom: 0;
    left: 0;
}
/* inner day */
.day span {
    display: flex;
    width: 25%;
    height: 100%;
    align-items: center;
    justify-content: center;
    font-family: 'Montserrat Alternates', sans-serif;
}
span.lang { font-size: 32px; }
span.num { font-size: 32px; }
span.num::before {content: '#';}
span.date {
    padding-top: 5px;
    background-color: #333;
    text-align: center;
    font-size: 16px;
    line-height: 1.4;
}
span.title {
    width: 90%;
    font-size: 26px;
    justify-content: flex-start;
    padding-left: 30px;
}
/* button */
.day button {
    font-family: 'Montserrat Alternates', sans-serif;
    width: 290px;
    display: inline-block;
    height: 50%;
    margin-right: 15px;
    border: 3px solid white;
    background: none;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    outline: none;
}
.day button i { font-size: 18px; }
.day button a {
    display: block;
    width: 100%;
    color: #fff;
    text-decoration: none;
    padding: 10px;
}
.day button:hover {
    background-color: #fff;
    color: #000;
}
.day button:hover a {
    color: #000;
}

@media screen and (max-width: 930px) {
    .day span {
        font-size: 20px;
    }
    .day span.date {
        font-size: 14px;
    }
    i {
        display: none;
    }
}

span.lang-JS { background-color: #F0DB4F; color: #323330; }
span.lang-PHP { background-color: #8892BF; color: #222530; }
span.lang-CSS { background-color: #29ABE2; color: #FEFEFE; }
span.lang-Shell { background-color: #222; color: #21D725; }
span.lang-TXT { background-color: #999; color: #555; }

.day:nth-child(1) .num {background-color: #e05452;}
.day:nth-child(2) .num {background-color: #e05652;}
.day:nth-child(3) .num {background-color: #e05952;}
.day:nth-child(4) .num {background-color: #e05b52;}
.day:nth-child(5) .num {background-color: #e05e52;}
.day:nth-child(6) .num {background-color: #e06052;}
.day:nth-child(7) .num {background-color: #e06252;}
.day:nth-child(8) .num {background-color: #e06552;}
.day:nth-child(9) .num {background-color: #e06752;}
.day:nth-child(10) .num {background-color: #e06952;}
.day:nth-child(11) .num {background-color: #e06c52;}
.day:nth-child(12) .num {background-color: #e06e52;}
.day:nth-child(13) .num {background-color: #e07152;}
.day:nth-child(14) .num {background-color: #e07352;}
.day:nth-child(15) .num {background-color: #e07552;}
.day:nth-child(16) .num {background-color: #e07852;}
.day:nth-child(17) .num {background-color: #e07a52;}
.day:nth-child(18) .num {background-color: #e07c52;}
.day:nth-child(19) .num {background-color: #e07f52;}
.day:nth-child(20) .num {background-color: #e08152;}
.day:nth-child(21) .num {background-color: #e08452;}
.day:nth-child(22) .num {background-color: #e08652;}
.day:nth-child(23) .num {background-color: #e08852;}
.day:nth-child(24) .num {background-color: #e08b52;}
.day:nth-child(25) .num {background-color: #e08d52;}
.day:nth-child(26) .num {background-color: #e08f52;}
.day:nth-child(27) .num {background-color: #e09252;}
.day:nth-child(28) .num {background-color: #e09452;}
.day:nth-child(29) .num {background-color: #e09752;}
.day:nth-child(30) .num {background-color: #e09952;}
.day:nth-child(31) .num {background-color: #e09b52;}
.day:nth-child(32) .num {background-color: #e09e52;}
.day:nth-child(33) .num {background-color: #e0a052;}
.day:nth-child(34) .num {background-color: #e0a352;}
.day:nth-child(35) .num {background-color: #e0a552;}
.day:nth-child(36) .num {background-color: #e0a752;}
.day:nth-child(37) .num {background-color: #e0aa52;}
.day:nth-child(38) .num {background-color: #e0ac52;}
.day:nth-child(39) .num {background-color: #e0ae52;}
.day:nth-child(40) .num {background-color: #e0b152;}
.day:nth-child(41) .num {background-color: #e0b352;}
.day:nth-child(42) .num {background-color: #e0b652;}
.day:nth-child(43) .num {background-color: #e0b852;}
.day:nth-child(44) .num {background-color: #e0ba52;}
.day:nth-child(45) .num {background-color: #e0bd52;}
.day:nth-child(46) .num {background-color: #e0bf52;}
.day:nth-child(47) .num {background-color: #e0c152;}
.day:nth-child(48) .num {background-color: #e0c452;}
.day:nth-child(49) .num {background-color: #e0c652;}
.day:nth-child(50) .num {background-color: #e0c952;}
.day:nth-child(51) .num {background-color: #e0cb52;}
.day:nth-child(52) .num {background-color: #e0cd52;}
.day:nth-child(53) .num {background-color: #e0d052;}
.day:nth-child(54) .num {background-color: #e0d252;}
.day:nth-child(55) .num {background-color: #e0d552;}
.day:nth-child(56) .num {background-color: #e0d752;}
.day:nth-child(57) .num {background-color: #e0d952;}
.day:nth-child(58) .num {background-color: #e0dc52;}
.day:nth-child(59) .num {background-color: #e0de52;}
.day:nth-child(60) .num {background-color: #e0e052;}
.day:nth-child(61) .num {background-color: #dee052;}
.day:nth-child(62) .num {background-color: #dce052;}
.day:nth-child(63) .num {background-color: #d9e052;}
.day:nth-child(64) .num {background-color: #d7e052;}
.day:nth-child(65) .num {background-color: #d5e052;}
.day:nth-child(66) .num {background-color: #d2e052;}
.day:nth-child(67) .num {background-color: #d0e052;}
.day:nth-child(68) .num {background-color: #cde052;}
.day:nth-child(69) .num {background-color: #cbe052;}
.day:nth-child(70) .num {background-color: #c9e052;}
.day:nth-child(71) .num {background-color: #c6e052;}
.day:nth-child(72) .num {background-color: #c4e052;}
.day:nth-child(73) .num {background-color: #c1e052;}
.day:nth-child(74) .num {background-color: #bfe052;}
.day:nth-child(75) .num {background-color: #bde052;}
.day:nth-child(76) .num {background-color: #bae052;}
.day:nth-child(77) .num {background-color: #b8e052;}
.day:nth-child(78) .num {background-color: #b6e052;}
.day:nth-child(79) .num {background-color: #b3e052;}
.day:nth-child(80) .num {background-color: #b1e052;}
.day:nth-child(81) .num {background-color: #aee052;}
.day:nth-child(82) .num {background-color: #ace052;}
.day:nth-child(83) .num {background-color: #aae052;}
.day:nth-child(84) .num {background-color: #a7e052;}
.day:nth-child(85) .num {background-color: #a5e052;}
.day:nth-child(86) .num {background-color: #a3e052;}
.day:nth-child(87) .num {background-color: #a0e052;}
.day:nth-child(88) .num {background-color: #9ee052;}
.day:nth-child(89) .num {background-color: #9be052;}
.day:nth-child(90) .num {background-color: #99e052;}
.day:nth-child(91) .num {background-color: #97e052;}
.day:nth-child(92) .num {background-color: #94e052;}
.day:nth-child(93) .num {background-color: #92e052;}
.day:nth-child(94) .num {background-color: #8fe052;}
.day:nth-child(95) .num {background-color: #8de052;}
.day:nth-child(96) .num {background-color: #8be052;}
.day:nth-child(97) .num {background-color: #88e052;}
.day:nth-child(98) .num {background-color: #86e052;}
.day:nth-child(99) .num {background-color: #84e052;}
.day:nth-child(100) .num {background-color: #81e052;}

.github-corner:hover .octo-arm {animation:octocat-wave 560ms ease-in-out}
@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}
@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}
.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}