#profile.full-wrapper {	background-color:#000 }


	#profile .inner { max-width:1280px; margin: 0 auto;}

	#profile .section { clear:both; padding:0px; margin:0px;}

	#profile .col { display: block; float:left; margin: 0;  margin-bottom:-10px\9; transition: all 0.3s ease-out; }
	#profile .col:first-child { margin-left: 0; }

	#profile .group:before,
	#profile .group:after { content:""; display:table; }
	#profile .group:after { clear:both;}
	#profile .group { zoom:1; /* For IE 6/7 */ }

	.profile { width: 25%;}
        .profile a{    position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; z-index: 22;}
        

	/* effect
	=============*/

	.col { overflow:hidden; cursor:pointer;}
	.col .thumb { opacity:1; z-index:5;
				-webkit-transform: scale(1);
				        transform: scale(1);
				       transition: all 0.3s ease-out; }

	.col:hover .thumb { opacity: 0.4;
				-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
				        transition: opacity 0.35s, transform 0.35s;
				 -webkit-transform: scale(1.15);
				         transform: scale(1.15);

			    -webkit-transform: scale(1)\9;
			        -ms-transform: scale(1)\9;
			            transform: scale(1)\9;}

	.col .overlay { opacity:0; visibility:hidden; position:absolute; top:0; left:0; z-index:10;
			 	       transition: all 0.3s ease-out; 
			 	-webkit-transform: scale(1.2);
			        -ms-transform: scale(1.2);
			            transform: scale(1.2);

			    -webkit-transform: scale(1)\9;
			        -ms-transform: scale(1)\9;
			            transform: scale(1)\9;}
	.col:hover .overlay { opacity:0.9; visibility:visible; 
			 	-webkit-transform: scale(1);
			        -ms-transform: scale(1);
			            transform: scale(1);}

	.profileInfo-blk { position:absolute; top:0; left:0; z-index:20; padding:25px}
	.col h2, .col h3 { color:#fff; text-transform:uppercase; line-height:normal;  padding:0; margin:0;}
	.col h2 { font-size: 25px; opacity:0; margin-left:10px; transition: all 0.3s ease-out; }
	.col h3 { font-size: 16px; opacity:0; margin-left:10px; transition: all 0.3s ease-out; }

	.col:hover h2 { opacity:1; margin-left:0px; }
	.col:hover h3 { opacity:1; margin-left:0px; }

	.col .more { opacity:1; right:5%;
				 z-index:10; position:absolute; z-index:20;}

	.col .dot { width: 30px; height: 30px; background-color:#fff; margin-right:10px; display:inline-block;
				   -moz-border-radius: 50px;
				-webkit-border-radius: 50px;
				        border-radius: 50px;  bottom:-100px;  bottom:60px\9; opacity:0; visibility:hidden; }
	.col:hover .dot:nth-child(1),
	.col:hover .dot:nth-child(2),
	.col:hover .dot:nth-child(3) { opacity:1; visibility:visible; bottom:60px; }

	.col:hover .dot:nth-child(1) { transition: all ease .3s; transition-delay: 0.1s; -webkit-transition-delay: 0.1s}
	.col:hover .dot:nth-child(2) { transition: all ease .4s; transition-delay: 0.2s; -webkit-transition-delay: 0.2s}
	.col:hover .dot:nth-child(3) { transition: all ease .5s; transition-delay: 0.3s; -webkit-transition-delay: 0.3s}


	.col .color-blk	{ position:absolute; top:0; left:0; width:100%; opacity:0.75; transition: all 0.3s ease-out; z-index:5}
	.col .color-blk.green	{ background-color:#015a52;}
	.col .color-blk.red	    { background-color:#a2032e;}
	.col .color-blk.yellow	{ background-color:#ca9a43;}
	.col .color-blk.purple	{ background-color:#36006d;}
	.col .color-blk.grey	{ background-color:#333;}


	.col .color-blk	img 	{ width:100%;}
	.col:hover .color-blk 	{ opacity:0;}
              
	/* ==========================================================================
		Media Styles
	============================================================================= */

  	@media only screen and (max-width:1024px) {
  	.profile { width: 33.33%;}
  	.col .dot 	{ width:25px; height:25px;}
	.col:hover .dot:nth-child(1),
	.col:hover .dot:nth-child(2),
	.col:hover .dot:nth-child(3) { bottom:50px; }
	.col:hover .dot:nth-child(1) { transition: all ease .3s; transition-delay: 0.1s; -webkit-transition-delay: 0.1s}
	.col:hover .dot:nth-child(2) { transition: all ease .3s; transition-delay: 0.1s; -webkit-transition-delay: 0.1s}
	.col:hover .dot:nth-child(3) { transition: all ease .3s; transition-delay: 0.1s; -webkit-transition-delay: 0.1s}

  	}

	@media only screen and (max-width: 768px) {
	.profile { width: 50%;}

	.col .dot 	{ width:20px; height:20px;}
	.col:hover .dot:nth-child(1),
	.col:hover .dot:nth-child(2),
	.col:hover .dot:nth-child(3) { bottom:45px; }


	}

	@media only screen and (max-width: 479px) {
  	.profile { width: 100%;}
	.col .dot 	{ width:20px; height:20px;  bottom:50px;}
	.col:hover .dot:nth-child(1),
	.col:hover .dot:nth-child(2),
	.col:hover .dot:nth-child(3) { bottom:50px; }

	}