


.container {
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr ;
	
	
	
}

.box{
	padding:100px;
	
	background:red;
	color:white;
	justify-content: center;
	align-items:center;
	text-align:center;
	transition: all 0.25s ease-in;
	font-family:sans-serif;
}
.box:hover {
	background: #a4a2b0;
	
}
.one{
	background:lightgray;
	grid-column-start:1;
	grid-column-end:3;
	grid-row-start: 1;
	grid-row-end: 4;
	justify-content: left;
	text-align: left;
	color:#13284c;
	font-size: 24pt;
}

.two{
	display:grid;
	grid-row-start:1;
	grid-row-end: 4;
	background:#d42240;
	position: relative;
	color:white;
	

}
.two:hover{
	display:grid;
	position: relative;

}

.dropbtn{
	background:none;
	color:white;
	border:none;

}

.dropdown {
	display: none;
  position: relative;
  background-color: #f1f1f1;
  min-width: 50px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  line-height: 5pt;
  font-size: 10pt;
 
  
}
.dropdown a{
color: black;
  padding: 10px 10px;
  text-decoration: none;
  display: grid;
   transition: all 0.75s ease-in; /* here */
  tranform:scale(1);
 

}

.two:hover .dropdown { display: grid;tranform:scale(1.5);}
.four:hover .dropdown { display: grid;tranform:scale(1.5);}

.dropdown:hover {}

.a:hover{background:lightgray;
}

.three{
 grid-row-start:1 ;
 grid-row-end:3 ;
}
.four{
	grid-row-start: 3;
	grid-row-end: 5;
	display:grid;
	background:#d42240;
	position: relative;
	color:white;
}
.four:hover{
	display:grid;
	position: relative;}


.five{
	grid-row-start: 4;
	grid-row-end:5;
}

.six{
	grid-row-start: 4;
	grid-row-end:5;
	grid-column-start:2;
	grid-column-end: 3;
	background: #c41230;
}
.seven {
background:#e43250;;
    grid-column-start:3;
	grid-column-end:4;
	grid-row-start:4 ;
	grid-row-end: 5;
}


.eight {
	background: #13284c;
	display:grid;
	grid-column-start:1;
	grid-column-end: 5;
	grid-row-start:5;
	grid-row-end: 6;
}

.gd150{
	font-size: 22px;
}

.web {
	font-size: 18px;
}

.instructor {
	font-size: 10pt;
}

