
/************************************************************************
*  Image Feature css
************************************************************************/
	/*Image Feature element start*/

	.tgx-image-feature{
		transition: all 0.4s ease;
	}

	.tgx-image-feature .block:hover{
		transition: all 0.4s ease;
	}

	.tgx-image-feature .block {
	  padding: 40px 20px 30px;
	  position: relative;
    	transition: all 0.4s ease;
	}
	.tgx-image-feature .block .hover-round {
	  width: 100px;
	  height: 100px;
	  line-height: 96px;
	  display: inline-block;
	  position: relative;
	  text-align: center;
	  margin: 20px 0 30px;
	  background-color: #fff;
	}
	.tgx-image-feature .block .hover-round:after {
	  border: 1px solid #ddd;
	  content: "";
	  -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
	  -webkit-transform: scale(0.8);
	  -moz-transition: -moz-transform 0.2s, opacity 0.2s;
	  -moz-transform: scale(0.8);
	  -ms-transform: scale(0.8);
	  transition: transform 0.2s,opacity 0.2s;
	  transform: scale(0.8);
	  opacity: 0;
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  border-radius: 50%;
	  -webkit-box-sizing: content-box;
	  -moz-box-sizing: content-box;
	  box-sizing: content-box;
	    top: -8px;
	    left: -8px;
	    padding: 7px;
	    right: 0;
	    bottom: 0;
	    pointer-events: none;
	}
	.tgx-image-feature .block:hover .hover-round:after {
	  -webkit-transform: scale(1);
	  -moz-transform: scale(1);
	  -ms-transform: scale(1);
	  transform: scale(1);
	  opacity: 1;
	}

	.tgx-image-feature .block .feature-title{
		transition: all 0.3s ease;
		font-size: 24px;
    	font-weight: 600;
	}

	.tgx-image-feature .block:hover .feature-title,
	.tgx-image-feature .block:hover .feature-desc{
		transition: all 0.3s ease;
	}

	.tgx-image-feature .hover-angle {
	    border: 1px solid transparent;
	    display: inline-block;
	    height: 80px;
	    width: 80px;
	    line-height: 75px;
	    margin: 20px 0 30px;

	    -webkit-transform: rotate(45deg);
	       -moz-transform: rotate(45deg);
	        -ms-transform: rotate(45deg);
	         -o-transform: rotate(45deg);
	            transform: rotate(45deg);

	    -webkit-transition: all 0.3s ease;
	       -moz-transition: all 0.3s ease;
	        -ms-transition: all 0.3s ease;
	         -o-transition: all 0.3s ease;
	            transition: all 0.3s ease;
	}

	.tgx-image-feature .feature-heading a:hover{text-decoration: none;}

	.tgx-image-feature .hover-angle .tgx-media,
	.tgx-image-feature .hover-angle .feature-icon {
		 -webkit-transform: rotate(-45deg);
	    -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	    -o-transform: rotate(-45deg);
	    transform: rotate(-45deg);
        -ms-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;

	}


	.tgx-image-feature .hover-angle .tgx-media,
	.tgx-image-feature .hover-angle .feature-icon,
	.tgx-image-feature .hover-angle svg {
		 -webkit-transform: rotate(0deg);
	    -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	    -o-transform: rotate(-45deg);
	    transform: rotate(-45deg);

	}

	.tgx-image-feature .block:hover .hover-angle {
	    border: 1px solid #ddd;
	    color: #ed485f;
		-ms-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
	}


	.tgx-image-feature .hover-round .feature-icon{
	    font-size: 40px;
	    line-height: 100px;
	}
	.tgx-image-feature .hover-angle .feature-icon{
	    font-size: 40px;
	    line-height: 80px;
	    transition:all 0.5s ease-in-out;
	}

	.tgx-image-feature .hover-angle svg{
		  width:60px;
		  height:100px;
			 -webkit-transform: rotate(0deg);
	    -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	    -o-transform: rotate(-45deg);
	    transform: rotate(-45deg);
		  transition:all 0.5s ease-in-out;
	  }

	.tgx-image-feature .hover-round svg{
	  width:60px;
	  height:100px;
	  -webkit-transform: rotate(0deg);
	   -moz-transform: rotate(0deg);
	    -ms-transform: rotate(0deg);
	    -o-transform: rotate(0deg);
	    transform: rotate(0deg);
	  transition:all 0.5s ease-in-out;


	}
	.tgx-image-feature .block:hover .hover-round svg,
		.tgx-image-feature .block:hover .hover-round .feature-icon {
		transition:all 0.5s ease-in-out;
	    -webkit-transform: rotate(360deg);
	    -moz-transform: rotate(360deg);
	    -ms-transform: rotate(360deg);
	    -o-transform: rotate(360deg);
	    transform: rotate(360deg);
	}

	.tgx-image-feature .block:hover .hover-angle svg,
	.tgx-image-feature .block:hover .hover-angle .feature-icon {
	   transition:all 0.5s ease-in-out;
	    -webkit-transform: rotate(315deg);
	    -moz-transform: rotate(315deg);
	    -ms-transform: rotate(315deg);
	    -o-transform: rotate(315deg);
	    transform: rotate(315deg);

	}





