.supercal{width:270px;font-size:12px;z-index:0;overflow:hidden;}
.supercal .supercal-header{display:block;line-height:12px;margin-bottom:5px;text-align:center;position:relative;}
.supercal .supercal-header .prev-month{}
.supercal .supercal-header .next-month{}
.supercal-month{position:relative;z-index:0;overflow:hidden;}
.supercal table{width:270px;table-layout:fixed;background:#fff;}
.supercal tbody{border-left:solid 1px #cccccc;border-right:solid 1px #cccccc;}
.supercal td{cursor:pointer;font-size:12px;}
.supercal td:hover{background:#2f96b4 !important;color:#fff;}
.supercal td.month-prev, .supercal td.month-next{background:#eee;}
.supercal td.selected{background:#0088cc;color:#fff;font-weight:normal;}
.supercal td.today{font-weight:bold;}
.supercal .supercal-footer{width:100%;display:table;}
.supercal .supercal-footer span.supercal-input{display:table-cell;width:100%;cursor:default;}
#myImg{border-radius:5px;cursor:pointer;transition:0.3s;}
#myImg:hover{opacity:0.7;}
.modal{display:none;position:fixed;z-index:50;padding-top:150px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.9);}
.modal-content{margin:auto;display:block;width:100%;max-width:1000px;}
#caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px;}
.modal-content, #caption{-webkit-animation-name:zoom;-webkit-animation-duration:0.6s;animation-name:zoom;animation-duration:0.6s;}
@-webkit-keyframes zoom{from{-webkit-transform:scale(0)}
to{-webkit-transform:scale(1)}
}
@keyframes zoom{from{transform:scale(0)}
to{transform:scale(1)}
}
.close{position:absolute;top:100px;right:35px;color:#f1f1f1;font-size:40px;font-weight:bold;transition:0.3s;}
.close:hover,
.close:focus{color:#bbb;text-decoration:none;cursor:pointer;}
@media only screen and (max-width:700px){.modal-content{width:100%;}
}