@media (min-width: 1100px) {


.col-1  { width: calc( 100% / 12 * 1 );}
.col-2  { width: calc( 100% / 12 * 2 );}
.col-3  { width: calc( 100% / 12 * 3 );}
.col-4  { width: calc( 100% / 12 * 4 );}
.col-5  { width: calc( 100% / 12 * 5 );}
.col-6  { width: calc( 100% / 12 * 6 );}
.col-7  { width: calc( 100% / 12 * 7 );}
.col-8  { width: calc( 100% / 12 * 8 );}
.col-9  { width: calc( 100% / 12 * 9 );}
.col-10 { width: calc( 100% / 12 * 10 );}
.col-11 { width: calc( 100% / 12 * 11 );}
.col-12 { width: calc( 100% / 12 * 12 );}


h1 {
	font-size: .9em;
	letter-spacing: .08;
}

h2 {
	font-size: .7em;
	float: right;
	text-align:right;
}

h3 {
	font-size: .9em;
}

.class {
	height: auto;
}

span.bracket-1 {
    height: 1.6em;
}

span.bracket-2 {
    height: 2.4em;
}

span.bracket-3 {
    height: 1.6em;
}

span.bracket-4 {
    height: 3.2em;
}

.illusionism {
	letter-spacing: .2em;
	-webkit-transition: color .1s;
    transition: color .2s;
}

.illusionism:hover {
	color: #FF4365;
	-webkit-transition: color .1s;
    transition: color .2s;
}


#header {
	height: 0em;
}

.subtitle {
	display: block;
	position: absolute;
	text-align: right;
	transform: rotate(270deg);
	margin-top: 14em;
	margin-left: -100px;

}

.subtitle-class {
	display: block;
	position: absolute;
	text-align: right;
	transform: rotate(270deg);
	margin-top: 30em;
	margin-left: -100px;

}

.subtitle h3 {
	display: block;
	font-family: 'Lato';
	letter-spacing: .3em;
	color: #030301;
	font-style: normal;
	font-weight: 1000;
	text-transform: uppercase;
	font-size: 1em;
	margin: 0px;
	padding: 0px;
}

#burger {
	display: none;
}

#nav {
	display: block;
	background-color: unset;
	position: fixed;
	bottom: 0em;
	margin-top: auto;

}

h4 {
	font-size: 1em;
	color: #FFFFF3;
	line-height: 1.6em;
	display: inline-block;
	margin-right: 1em;
}

.menu {
	float: right;
}

.menu h4 {
	-webkit-transition: color .1s;
    transition: color .2s;
}

.menu h4:hover {
	-webkit-transition: color .1s;
    transition: color .2s;
    color: #FF4365;
}

.first {
	bottom: 0px;
	position: relative;
	right: 3em;
}

.second {
	transform: rotate(270deg);
	position: absolute;
	right: -40px;
	bottom: 8em;
}

.second-class {
	transform: rotate(270deg);
	position: absolute;
	right: -190px;
	bottom: 14em;
}

.theme {
	width: 70%;
	margin-left: 15%;
	margin-right: 15%;
}

.summary {
	margin-left: 7.5%;
	width: 40%;
	padding-top: 4em;
	display: inline-block;
	float: left;
}

.images-box {
	width: 40%;
	margin-left: 5%;
	margin-right: 7.5%;
	padding-top: 4em;
	display: inline-block;
}

img {
	width: 100%;
	padding-bottom: 1em;

}

.class-title {
	margin-left: 5%;
	width: 100%;
}

.class-text h2{
	font-family: 'Merriweather';
	font-size: 1.5em;
	color: #FFFFF3;
	text-transform: initial;
	text-align: left;
	float: left;
}

p{
	font-size: 1.1em;
	line-height: 1.5em;
	color: #999999;

}

h5 {
	font-family: 'Lato';
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: .5em;
	font-weight: 1000;
	line-height: 1em;
	color: #FF4365;
	margin: 0;
	padding-top: 1.5em;
}

h6 {
	font-family: 'Lato';
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: .5em;
	font-weight: 1000;
	line-height: 1em;
	color: #FF4365;
	margin: 0;
	padding-bottom: .5em;
}

.subhead {
	margin-left: 5%;
	margin-bottom: -10px;
	margin-top: .5em;
}

.in-class-assignment {
	width: 40%;
	margin-left: 5%;
	margin-right: 7.5%;
	padding-top: 4em;
	display: inline-block;
}

.about {
	margin-left: 7.5%;
	width: 40%;
	padding-top: 4em;
	display: inline-block;
	float: left;
}

a {
	text-decoration: none;
	color:#FFFFF3;
}






















}