.box {
	width: 250px;
	height: 250px;
	float: left;
	margin: 25px;
	border: 3px solid #DDDDDD;
	border-radius: 20px;
	padding: 30px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
	transistion: all .3s;
}

.projects {
	width: 930px;
	margin: 0 auto;
	position: relative;
}

.box:hover {
	background-color: #DDDDDD;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
	transistion: all .3s;
}

.readmore:hover {
	cursor: pointer;
}

.overlay {

display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #000000; /* In case opac. doesn't work*/
background-color: rgba(0,0,0,0.38);

opacity:0;
-webkit-transition: opacity .3s;
-moz-transition: opacity .3s;
-o-transition: opacity .3s;
transition: opacity .3s;
}

/*.overlay-content {
background-color: #ffffff;
margin: 5% auto;
padding: 20px;
border: 3px solid #666666;
/*border: 3px solid #880000;
border: 3px solid #000000;
border-radius: 30px;   *//*
width: 50%;
height: 65%;
}*/

.overlay-content {
background-color: #ffffff;
margin: 0 auto;
position: relative;
padding: 20px;
/*
border: 3px solid #666666;border: 3px solid #880000;
border: 3px solid #000000;
border-radius: 30px;*/
width: 1000px;
height: 600px;
height: 65%;
margin-top: 150px;
overflow: auto;
}

.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: 900;
margin-top: -20px;
margin-right: -10px;
}

.close:hover, .close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
