.dashWrapper {
  grid-template-areas: 
    "h  h  h"
    "a1 a2 a3"
    "a4  a5 a6"; 
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 50px 3fr 3fr;
  width:100%;
  height: calc(85vh - 50px);
}

.dashHeader {
  grid-area: h;
  border:solid 1px #555;
  background-image: linear-gradient(to bottom, #696969, #5f5f5f, #555555, #4b4b4b, #414141);
}

.headContainer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color:#AAA;
  width:100%;
  background:transparent;
  height:48px;
  
}

.headContainer *{
	background:transparent;
	color:#CCC;
	font-size:100%;
	line-height:45px;
	
}
.headContainer{

}

.headContainer a{
	font-size:110%;
	font-weight:bold;
	text-decoration:none;
	margin:0 10px;
}

.headContainer a:hover {
	color:#EFEFEF;
}

.dashHeadItemLeft {

}

.dashHeadItemCenter {

}

.dashHeadItemRight {

	
}

.topCalendar{
	width:27px;
	margin-left:12px;
	margin-right:12px;
	border:none;
}




.dashItem {
	text-align: center;
	border:solid 1px #AAA;
	border-radius:8px;
	
	-webkit-box-shadow: 6px 6px 8px 0px rgba(207,207,207,1);
	-moz-box-shadow: 6px 6px 8px 0px rgba(207,207,207,1);
	box-shadow: 6px 6px 8px 0px rgba(207,207,207,1);
	
	padding:10px;
	padding-top:27%;
}

.itemContents {
	display: grid;
	place-items: center;
	background:transparent;
}

.itemContents * {
	background:transparent;
}

.dashItem:not(.emptyEvent):hover {
    -webkit-filter: brightness(90%);
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -o-transition: all .4s ease;
    -ms-transition: all .4s ease;
    transition: all .4s ease;
	cursor:pointer;
}

.itemContents p {
	color: #888;
	font-size:90%;
}

.itemContents p.eventTitle{
	color: #000;
	font-size:125%;
	margin-bottom:5px;
}

.dashItem.first { grid-area: a1; }
.dashItem.second { grid-area: a2; }
.dashItem.third { grid-area: a3; }
.dashItem.forth { grid-area: a4; }
.dashItem.fifth { grid-area: a5; }
.dashItem.sixth { grid-area: a6; }

.emptyEvent {

 background-image: linear-gradient(to right top, #f6f6f6, #f1f1f1, #ebebeb, #e6e6e6, #e1e1e1);
  


}

@media only screen and (max-width: 600px) {
  .dashWrapper {
    grid-template-areas: 
        "h"
        "a1"
        "a2"
        "a3"
		"a4"
		"a5"
        "a6";
		
	grid-template-rows: 50px 3fr 3fr 3fr 3fr 3fr 3fr;
	grid-template-columns: 1fr;
  }
  
  .dashItem {
	padding:10px;
  }
  
  .headContainer a{
	font-size:12px;
	margin:0 5px;
  }
  
  
}