#Portfolio
{
	margin-bottom:90px;
}
#PortfolioContainer
{
	margin-top:-45px;
	opacity:0.1;
}
#small
{
	display:none;
}
.content
{
	background-color:#black;
	background-image: url("../../images/portfolioimg/5.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	width:270px;
	height:235px;
	margin-bottom:10px;
	
	border-radius: 35px 35px 35px 35px;
	-moz-border-radius: 35px 35px 35px 35px;
	-webkit-border-radius: 35px 35px 35px 35px;
	
	border:1px solid black;
	
}
#poprtImg3
{
	background-image: url("../../images/portfolioimg/E-shop.png");
	background-size: cover;
	background-repeat: no-repeat;
	
}
#poprtImg1
{
	background-image: url("../../images/portfolioimg/Bank.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom;
}
#poprtImg2
{
	background-image: url("../../images/portfolioimg/E-Mall3.png");
	background-size: 99% 100%;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg4
{
	background-image: url("../../images/portfolioimg/E-SocialN.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom;
}
#poprtImg5
{
	background-image: url("../../images/portfolioimg/MyBlog.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg6
{
	background-image: url("../../images/portfolioimg/E-Appointment.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg7
{
	background-image: url("../../images/portfolioimg/MemGame.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg8
{
	background-image: url("../../images/portfolioimg/NSpag.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg9
{
	background-image: url("../../images/portfolioimg/Birds.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#poprtImg10
{
	background-image: url("../../images/portfolioimg/CVP.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.displayAtHover
{
	display:block;
	background-color:#ff9800;
	color:black;
	width:268px;
	height:233px;
	opacity:0;
	text-align:center;
	padding:10px;
	padding-top:18%;
	
	border-radius: 35px 35px 35px 35px;
	-moz-border-radius: 35px 35px 35px 35px;
	-webkit-border-radius: 35px 35px 35px 35px;
	
	
}
.displayAtHover h5
{
	margin-top:15px;
	margin-bottom:60px;
}

.content:hover .displayAtHover 
{
	opacity:0.9;
	
	transition:opacity 600ms linear;
}
.content:hover .displayAtHover h5
{
	margin-bottom:50px;
	
	transition:margin-bottom 700ms linear;
}

.PortfButtonLink
{
	width:140px;
	color:#e6e6e6;
	background-color:#1a1a1a;
	margin-top:-6px;
	border-radius: 15px 15px 15px 15px;
	-moz-border-radius: 15px 15px 15px 15px;
	-webkit-border-radius: 15px 15px 15px 15px;
	border: 2px solid black;
	
	
}
.PortfButtonLink:hover
{
	color:#ff9800;
	-webkit-box-shadow: -1px 0px 10px 2px rgba(0,0,0,1);
	-moz-box-shadow: -1px 0px 10px 2px rgba(0,0,0,1);
	box-shadow: -1px 0px 10px 2px rgba(0,0,0,1);
}



@media only screen and (max-width: 1199px) 
{
	.content
	{
		width:230px;
		height:215px;
	}
	.displayAtHover
	{
		width:228px;
		height:213px;
	}
	.displayAtHover h5
	{
		font-size:19px;
		margin-bottom:50px;
	}
	
	.content:hover .displayAtHover h5
	{
		margin-bottom:40px;
		
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:20px;
	}
	
}
@media only screen and (max-width: 991px) 
{
	.content
	{
		width:170px;
		height:185px;
	}
	.displayAtHover
	{
		width:168px;
		height:183px;
	}
	.displayAtHover h6
	{
		font-size:13px;
		
	}
	.displayAtHover h5
	{
		font-size:17px;
		margin-bottom:30px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:20px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:13px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:20px;
		
	}
	.PortfButtonLink
	{
		font-size:14px;
		width:100px;
	}
}
@media only screen and (max-width: 767px) 
{
	.content
	{
		width:130px;
		height:130px;
	}
	.displayAtHover
	{
		width:128px;
		height:128px;
		padding-top:15%;
	}
	.displayAtHover h6
	{
		font-size:9px;
		
	}
	.displayAtHover h5
	{
		font-size:12px;
		margin-top:10px;
		margin-bottom:18px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:5px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:11px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:15px;
		
	}
	.PortfButtonLink
	{
		font-size:12px;
		width:90px;
	}
}
/*-- Αρχικές Τιμές για Mobile --*/
@media only screen and (max-width: 575px) 
{
	#medLarge
	{
		display:none;
	}
	#small
	{
		display:block;
	}
	.content
	{
		width:235px;
		height:235px;
	}
	.displayAtHover
	{
		width:233px;
		height:233px;
		padding:5px;
		padding-top:15%;
	}
	.displayAtHover h6
	{
		font-size:13px;	
	}
	.displayAtHover h5
	{
		font-size:20px;
		margin-bottom:70px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:50px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:14px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:50px;
	}
	.PortfButtonLink
	{
		font-size:14px;
		width:110px;
	}
}
@media only screen and (max-width: 515px) 
{
	.smallColPortf
	{
		padding-right:2%;
		padding-left:2%;
	}
}
@media only screen and (max-width: 500px) 
{
	
	.content
	{
		width:220px;
		height:220px;
	}
	.displayAtHover
	{
		width:218px;
		height:218px;
	}
	.displayAtHover h5
	{
		margin-bottom:55px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:40px;
	}
	
}
@media only screen and (max-width: 480px) 
{
	.content
	{
		width:210px;
		height:210px;
	}
	.displayAtHover
	{
		width:208px;
		height:208px;
	}
	.displayAtHover h5
	{
		margin-bottom:45px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:35px;
	}
}
@media only screen and (max-width: 450px) 
{
	.content
	{
		width:190px;
		height:190px;
	}
	.displayAtHover
	{
		width:188px;
		height:188px;
	}
	.displayAtHover h6
	{
		font-size:12px;
	}
	.displayAtHover h5
	{
		font-size:19px;
		margin-bottom:35px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:30px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:12px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:28px;
	}
	.PortfButtonLink
	{
		font-size:13px;
	}
}
@media only screen and (max-width: 411px) 
{
	.content
	{
		width:180px;
		height:180px;
	}
	.displayAtHover
	{
		width:178px;
		height:178px;
		padding-top:15%;
	}
	.displayAtHover h5
	{
		margin-top:10px;
		margin-bottom:25px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:20px;
	}
}
@media only screen and (max-width: 392px) 
{
	.content
	{
		width:165px;
		height:165px;
	}
	.displayAtHover
	{
		width:163px;
		height:163px;
	}
	.displayAtHover h6
	{
		font-size:11px;
	}
	.displayAtHover h5
	{
		font-size:16px;
		margin-bottom:30px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:25px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:12px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:20px;
	}
	.PortfButtonLink
	{
		font-size:12px;
		width:100px;
	}
	
}
@media only screen and (max-width: 337px) 
{
	.content
	{
		width:155px;
		height:155px;
	}
	.displayAtHover
	{
		width:153px;
		height:153px;
	}
	.displayAtHover h5
	{
		margin-bottom:20px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:18px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:11px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:15px;
	}
}
@media only screen and (max-width: 319px) 
{
	.content
	{
		width:125px;
		height:125px;
	}
	.displayAtHover
	{
		width:123px;
		height:123px;
	}
	.displayAtHover h6
	{
		font-size:8px;
	}
	.displayAtHover h5
	{
		font-size:12px;
		margin-bottom:20px;
	}
	#poprtImg10 .displayAtHover h5
	{
		margin-bottom:15px;
	}
	#poprtImg10 .displayAtHover h7
	{
		font-size:9px;
	}
	.content:hover .displayAtHover h5
	{
		margin-bottom:15px;
	}
	.PortfButtonLink
	{
		font-size:9px;
		width:80px;
	}
}