* {
  box-sizing: border-box;
}
/* For mobile phones: */
[class*="col-"] {
  width: 100%;
}
#bigbox, #title, #content {
  width: 100%;
}

@media only screen and (min-width: 768px) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6, p.mainlinks {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10, #bigbox {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12, #title, #content {width: 100%;}
}
body { /* biggest container ever */
	background: #fff url(images/background.png) no-repeat fixed top;
	margin: 0px;
	font-family: verdana, sans-serif;
	color: #05a;
}

#bigbox { /* contains everything */
	padding: 0px;
	margin-left: auto;
	margin-right: auto;
}

#title { /* just the title box */
	padding: 5px;
	margin: 20px 0px 20px;
}

#title h1 { /* header */
	margin: 0px;
	text-align: center;
	vertical-align: middle;
	padding: 0px;
	color: #7bf;
}

#content { /* The main content box */
}

#content ul {
	list-style-type: none;
}

#content p.mainlinks { /* links */
	font-weight: 700;
	font-size: 200%;
}

.blurry { /* blurry effect */
	backdrop-filter: blur(20px) brightness(1.09) saturate(0.4);
	border: 1px solid #cdf;
	margin: 0px 0px 30px 0px;
	border-radius: 5px;
	
}

.blurry p {
	padding: 0 4px 0 4px;
	margin: .5em 0
}

.resumehead {
	text-align: center;
	letter-spacing: 4px;
	font-weight: 700;
}

.resumehead2 {
	text-align: center;
	font-weight: 700;
}

#resume ul {
	list-style-type: circle;
}

a {
	text-decoration: none;
	color: #47f;
}

a:hover {
	color: #05a;
	text-shadow: #aaf 3px 3px 4px;
}
@media only screen and (min-width: 768px) {
	#title {
		font-size: 200%;
	}
}