.boxed{
    padding: 30px; box-shadow: 3px 3px 5px 6px #ddd;
}
    table{
        width: 100%;
    }
    th, td{
        text-align: center; padding: 7px 5px; position: relative;
    }
    .calender-arrow{
        min-height: 60px; position: relative; 
    }
    .calender-header{
        position: relative;
    }
    .calender-header .right{
        right: 12px;  cursor: pointer;
    }
    .calender-header .left{
        left: 12px;  cursor: pointer;
    }
    .calender-header .left, .calender-header .right{
        position: absolute; top: 50%; transform: translateY(-50%); font-size: 30px;
    }
    .calender-header .center{
        position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
        font-size: 16px; font-weight: bold;
    }
    
    .color-box{
        width: 25px; height: 25px; margin-right: 5px; display: block; float: left;
    }
    .black{
        color: #fff; background-color: #000;
    }
    .pink{ color: #000; background-color: pink; }
    .orange{
        color: #fff; background-color: darkorange;
    }
    .green{
        color: #fff; background-color: green;
    }
    .red{
        color: #fff; background-color: red;
    }
    .gold{
        color: #fff; background-color: goldenrod;
    }
    .blue{
        color: #fff; background-color: blue;
    }
    #calender-analyzer{
        background-color: #777; color: #fff; padding: 10px;
    }
    td{
        padding: 0;
    }
    td p{
        padding: 7px 5px; margin: 0;
    }
    .indicators{
        text-align: left; padding-left: 5px; padding-right: 5px;
    }
    .fa-calendar{
        color: orangered;
    }
    @media only screen and (max-width: 600px) {
        .boxed{
            padding: 0;
        }
    }