
body {
	font-size: 100%;
	font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

a:link, a:visited { 
	color: black;
	text-decoration: none;
	cursor: auto;
}

.hoverbox:hover, .title:hover{
	opacity: 0.9;
}

.box:hover{ 
	border: none;
}

.menu:hover{
	opacity: 1;
	text-decoration: underline;
	color: #66FF00;
}

.menu_container {
   	z-index: 1;
   	position: fixed;
   	top:0;
   	left:0;
   	width: 80%;
   	padding-left: 10%; /*padding is in addition to stated width*/
   	padding-right: 10%; /*padding is in addition to stated width*/
   	height: 30px;
   	padding-top: 25px;
   	background-color: white;
}

.name {
   	float: left;
   	letter-spacing: 0.1em;
   	padding-right: 5%;
}

.menu, .menu_current {
  	float: right;
   	padding-left: 3%;
   	opacity: 0.5;
}

.menu_current {
  	opacity: 0.8;
  	font-weight: bold;
}


#photos {
/*specify columns for photos*/
  	z-index: 2;
	width: 80%;
   	height: adjust;
   	margin-left: 10%;   
   	margin-top: 70px; 	
   	-webkit-column-count: 3;
   	-webkit-column-gap: 5%;  
   	-moz-column-count: 3;
   	-moz-column-gap: 5%;  
   	column-count: 3;
   	column-gap: 5%;
	min-height: calc(100vh - 70px);
}

.box {
/*specify boxes for photos*/  
  	position: relative;
  	display: inline-block;
  	width: 95%;
  	height: auto;
  	border: 1.5px dotted black;
  	border-radius: 2%; 
  	padding: 2.5%;
 	margin-bottom: 5%;
}

.hoverbox{
/*specify hoverbox*/
 	position: absolute;
 	top: 0;
 	left: 0;
 	width: 100%;
  	height: 100%;
 	background: white;
 	opacity: 0;
 	border: 1.5px dotted #66FF00;
 	border-radius: 2%;  
}

.title{
/*specify title in hoverbox*/
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	text-align: center;
  	font-size: 120%;
}

.theses {
  	text-align: center;
	width: 100%;
  	padding-top: 1%;
  	padding-bottom: -10%;
  	font-size: 120%;
  	font-weight: bold;
}

#theses {
/*specify columns for photos*/
  	z-index: 2;
	width: 80%;
   	height: adjust;
   	margin-left: 10%;   
   	margin-top: 30px; 	
   	-webkit-column-count: 3;
   	-webkit-column-gap: 5%;  
   	-moz-column-count: 3;
   	-moz-column-gap: 5%;  
   	column-count: 3;
   	column-gap: 5%;
	min-height: calc(100vh - 70px);
}

@media screen and (min-width: 1500px)
	and (max-width: 2000px){
  #photos {
  	-moz-column-count:    3;
  	-webkit-column-count: 3;
  	column-count:         3;
  	}
  #theses {
  	-moz-column-count:    3;
  	-webkit-column-count: 3;
  	column-count:         3;
  	}
}

@media screen and (min-width: 1000px)
	and (max-width: 1500px) {
  #photos {
  	-moz-column-count:    2;
  	-webkit-column-count: 2;
  	column-count:         2;
  	}
  #theses {
  	-moz-column-count:    2;
  	-webkit-column-count: 2;
  	column-count:         2;
  	}
}

@media screen and (min-width: 1px)
		and (max-width: 1000px) {
  #photos {
  	-moz-column-count:    1;
  	-webkit-column-count: 1;
  	column-count:         1;
  	}
  #theses {
  	-moz-column-count:    1;
  	-webkit-column-count: 1;
  	column-count:         1;
  	}
}
