body {
    color: #990000;
    font-family: futura-pt, sans-serif;
    font-style: normal;
    font-size: 1.5em;
    background-color: #990000;
    background-image: url("http://web.iyaclasses.com/~deorlow/USC-Texture-dark.png");

}
.line {
    border-top: 3px solid #FFFFFF;
    padding: 20px 0px 20px 0px;
}
.wrapper {
    display: grid;
    grid-template-columns: 50% 2% 50%;
    grid-template-rows: auto;
    width: 80%;
    margin: 50px auto;
}
.title {
    font-size: 3em;
    line-height: 1em;
    font-family: futura-pt-bold, sans-serif;
}
.b ul {
    list-style: none;
}
.a {
    /*   or grid-area: row-start / col start / row end / col end */
    
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}
.b {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
}
.c {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 2 / 3;
}
.d {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 3 / 4;
}
.e {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 4 / 5;
}


.f {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 2 / 3;
}
.g {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 3 / 4;
}
.h {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 4 / 5;
}
.i {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 5 / 6;
}
.j {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 6 / 7;
}
.k {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 7 / 8;
}
.l {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 8 / 9;
}
.m {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 9 / 10;
}

.n {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 5 / 6;
}
.o {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 6 / 7;
}
.p {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 7 / 8;
}
.q {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 8 / 9;
}
.r {
	font-weight: bold;
    font-size: 1.7em;
    grid-column: 3 / 4;
    grid-row: 9 / 10;
}

/* ========================================== MEDIA QUERIES ===================== */

@media only screen and (min-width: 460px) {
    .wrapper {
        display: block; 
        grid-template-columns: auto;
        grid-template-rows: auto;
    }
    .a {
   
        
        grid-row: 1 / 2;
    }
    .b {
        grid-column: 1 /2;
        grid-row: 2 / 3;
    }
    .c {
        grid-row: 3 / 4;
    }
    .d {
        grid-row: 4 / 5;
    }
    .e {
        grid-row: 5 / 6;
    }
    .f {
        grid-column: 1 /2;
        grid-row: 6 / 7;
    }
    .g {
        grid-column: 1 /2;
        grid-row: 8 / 9;
    }
    .h {
        grid-column: 1 /2;
        grid-row: 9 / 10;
    }
	
	.i {
    	grid-column: 1 / 2;
    	grid-row: 5 / 6;
	}
	.j {
		grid-column: 1 / 2;
		grid-row: 6 / 7;
		}
	.k {
		grid-column: 1 / 2;
		grid-row: 7 / 8;
	}
	.l {
		grid-column: 1 / 2;
		grid-row: 8 / 9;
	}
	.m {
		grid-column: 1 / 2;
		grid-row: 9 / 10;
	}

	.n {
		grid-column: 3 / 4;
		grid-row: 5 / 6;
	}
	.o {
		grid-column: 3 / 4;
		grid-row: 6 / 7;
	}
	.p {
		grid-column: 3 / 4;
		grid-row: 7 / 8;
	}
	.q {
		grid-column: 3 / 4;
		grid-row: 8 / 9;
	}
	.r {
		grid-column: 3 / 4;
		grid-row: 9 / 10;
	}
}

@media only screen and (min-width: 768px) {
    .wrapper {
    display: grid;
    grid-template-columns: 50% 2% 50%;
    grid-template-rows: auto;
    }
.a {
    /*   or grid-area: row-start / col start / row end / col end */
    
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}
.b {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
}
.c {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 2 / 3;
}
.d {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 3 / 4;
}
.e {
    font-weight: bold;
    font-size: 1.7em;
    grid-column: 1 / 2;
    grid-row: 4 / 5;
}
.f {
    grid-column: 3 / 4;
    grid-row: 2 / 3;
}
.g {
    grid-column: 3 / 4;
    grid-row: 3 / 4;
}
.h {
    grid-column: 3 / 4;
    grid-row: 4 / 5;
}
.i {
	font-weight: bold;
    font-size: 1.7em;
	grid-column: 1 / 2;
	grid-row: 5 / 6;
}
.j {
	font-weight: bold;
    font-size: 1.7em;
	grid-column: 1 / 2;
	grid-row: 6 / 7;
}
.k {
	font-weight: bold;
    font-size: 1.7em;
	grid-column: 1 / 2;
	grid-row: 7 / 8;
}
.l {
	font-weight: bold;
    font-size: 1.7em;
	grid-column: 1 / 2;
	grid-row: 8 / 9;
}
.m {
	font-weight: bold;
    font-size: 1.7em;
	grid-column: 1 / 2;
	grid-row: 9 / 10;
}

.n {
	grid-column: 3 / 4;
	grid-row: 5 / 6;
}
.o {
	grid-column: 3 / 4;
	grid-row: 6 / 7;
}
.p {
	grid-column: 3 / 4;
	grid-row: 7 / 8;
}
.q {
	grid-column: 3 / 4;
	grid-row: 8 / 9;
}
.r {
	grid-column: 3 / 4;
	grid-row: 9 / 10;
}
}

a:link {
  background-color: #FFFFFF;
  color: #990000;
  padding: 3px 3px;
  text-align: left;
  text-decoration: none;
  display: inline-block;
}

a:visited {
  background-color: #FFFFFF;
  color: #990000;
  padding: 3px 3px;
  text-align: left;
  text-decoration: none;
  display: inline-block;
}