﻿
/*image hover effects different colours*/

.project 
{
    float: left; 
    position: relative; 
    display: inline-block; 
    text-decoration: none;  
    overflow: hidden; 
}
.project .desc 
{
    display: inline-block; 
    width: 100%; 
    height: 100%; 
    background: #349c54;  
    position: absolute; 
    top: 100%; 
    left: 0; 
    color: #fff;  
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    padding: 10px; 
}
.project .tranparentdesc 
{
    display: inline-block; 
    width: 100%; 
    height: 100%; 
    background: #349c54;  
    position: absolute; 
    top: 100%; 
    left: 0; 
    color: #fff;  
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    padding: 10px; 
    opacity:0.9;
    filter:alpha(opacity=90);
}
.project .desc strong, .project .tranparentdesc strong 
{
    font-size: 20px; display: block; 
}
		
.project.half .desc, .project.half .tranparentdesc 
{ 
    top: 50%; 
}
.project:hover .desc ,.project:hover .tranparentdesc 
{
    top: 0%; 
    transition:1s all;
	-o-transition: 1s all;
	-ms-transition: 1s all;
	-moz-transition: 1s all;
	-webkit-transition: 1s all; 
}

.project.red .desc,.project.red .tranparentdesc {background: #E54028;}	
.project.green .desc, .project.green .tranparentdesc {background: #48dd00;}
.project.yellow .desc, .project.yellow .tranparentdesc {background: #FFFF00;}	
.project.bluelight .desc, .project.bluelight .tranparentdesc {background: #009999;}	
.project.bluepink .desc, .project.bluepink .tranparentdesc {background: #cd0074;}	
.project.pink .desc, .project.pink .tranparentdesc {background: #e6399b;}	
.project.orng .desc, .project.orng .tranparentdesc {background: #FF8B00;}		
.project.blue .desc, .project.blue .tranparentdesc {background: #00A1CB;}	

	

/*DIVS hover effects different colours*/
.o-lay_block 
{ 
    position: relative;
    overflow: hidden; 
    display: inline-block;
    padding-bottom:20px;
    padding-top:20px;
    width:100%; 
    margin:0 px auto;
    height:100%; 
    text-align:center;  
}
.o-lay_block .overlay, .team .overlay 
{ 
    position: absolute; 
    top: 100%; 
    left: 0; 
    width: 94%; 
    height: 94%; 
    padding: 3%;   
    background: rgba(0,0,0,0.7); 
}
.o-lay_block:hover .overlay 
{   
    top: 0%; 
    transition:all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;  
    z-index: 101;
}
.o-lay_block .overlay h3, .o-lay_block .overlay .tit, .team .overlay h3 
{ 
    color: #fff; 
    font-size: 20px; 
    font-weight: bold;  
    display: block; 
}
.o-lay_block a.overlay {text-decoration: none;}
.o-lay_block a.overlay:hover,.o-lay_block .overlay:hover  {color: #00A1CB; }
.o-lay_block .overlay p, .team .overlay p { color: #fff; font-size: 14px;}




