Flex calendar

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css">
<script src="http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,600,700,800,300&amp;subset=latin,cyrillic"></script>
<div class="calendar">

<div class="days">
	<a href="#" class="disable">29</a>
	<a href="#" class="disable">30</a>
	<a href="#">01</a>
	<a href="#">02</a>
	<a href="#">03</a>
	<a href="#">04</a>
	<a href="#">05</a>
	<a href="#">06</a>
	<a href="#">07</a>
	<a href="#">08</a>
	<a href="#">09</a>
	<a href="#">10</a>
	<a href="#">11</a>
	<a href="#">12</a>
	<a href="#">13</a>
	<a href="#">14</a>
	<a href="#">15</a>
	<a href="#">16</a>
	<a href="#">17</a>
	<a href="#">18</a>
	<a href="#" class="active">19</a>
	<a href="#">20</a>
	<a href="#">21</a>
	<a href="#">22</a>
	<a href="#">23</a>
	<a href="#">24</a>
	<a href="#">25</a>
	<a href="#">26</a>
	<a href="#">27</a>
	<a href="#">28</a>
	<a href="#">29</a>
	<a href="#">30</a>
	<a href="#">31</a>
	<a href="#" class="disable">01</a>
	<a href="#" class="disable">02</a>	
</div>

</div>

SCSS

body {
	background-color: rgb(223,223,223);
	font-family: "Open Sans", sans-serif;
	font-size:14px;
	color: rgb(45,60,80);
}

a {
	color:rgb(50,65,80);
	transition: background-color 0.2s ease;
    &:hover {
        color:rgb(40,55,65);
        text-decoration: none;
        transition: background-color 0.2s ease;	
    }
}

.calendar {
    a {
		display: block;
		padding: 10px;
		text-decoration: none;
		line-height: 1;
		text-align: center;
		background-color: rgb(255,255,255);
        &:hover {
            background-color: rgb(225,65,50);
            color: rgb(255,255,255);
        }
	}

	.days {
		display:flex;
		flex-wrap:wrap;
        
        a {
            width: percentage(1/7);
            box-sizing: border-box;
            
            &.disable {
                background-color: rgb(240,240,240);
                color: rgb(160,160,160);
                pointer-events:none;
            }
            &.active {
                background-color: rgb(215,55,35);
                color: rgb(255,255,255);
            }
        }
	}
}



.calendar a:nth-child(7n) {
    border:2px solid rgb(0,0,0);
}