/*
	file: grid.css
	author: Philip Munce
	last-mod: 29-12-2015
	comments: css styles for basic grid system
*/	

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
[class*='col-'] {
	float: left;
	padding-right: 20px;
}
.col-1-10 {
	width: 10%;
	text-align: center;
	margin: auto;
}
.col-6-10 {
	width: 60%;
	text-align: center;
	margin: auto;
}
.col-2-10 {
	width: 20%;
	text-align: center;
	margin: auto;
}
.col-2-10 {
	width: 20%;
	text-align: center;
	margin: auto;
}
.col-1-2 {
    width: 50%;
    text-align: center;
    margin: auto;
}
.col-1-4 {
	width: 25%;
	text-align: center;
	margin: auto;
}
.col-1-4-textcrowding {
	width: 10%;
	text-align: center;
	margin: auto;
}
.col-1-5 {
    /*width: 20%;*/
    text-align: center;
    -ms-flex-order: 0;
    order: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -ms-flex-item-align: auto;
    align-self: auto;
}
.col-2-5 {
    text-align: center;
    -ms-flex-order: 0;
    order: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -ms-flex-item-align: auto;
    align-self: auto;
}
.grid:after {
	content: "";
	display: table;
	clear: both;
}
.grid {
    width: 700px;
    box-sizing: border-box;
    -ms-flex-order: 0;
    order: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -ms-flex-item-align: auto;
    align-self: auto;
}

.lesson-container {
    left: -4%;
    position: relative;
    cursor:pointer;
}

.lesson-wrap {
  width:20%;
  height:140px;
  position:relative;
  /*background-color:#333;*/
  float:left;
  /*margin-right:10px;*/
  -webkit-font-smoothing:antialiased;
}

.lesson-face {
  position:absolute;
  width:140px;
  height:140px;
  overflow:hidden;
}

.front {
  background-color:#FFF; 
}

.back {
  background-color:#FFF; 
}