.gsc-image-content{
	 &.skin-v1{
	 text-align: center;
	 position: relative;
	 .image{
		position: relative;
		overflow: hidden;
		width: 60%;
		img{
		  border-radius: 4px;
		}
		@include media-breakpoint-down(sm){
			 padding: 0;
			 width: 100%;
		}
	 }
	 .box-content{
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		width: 60%;
		z-index: 11;
		box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.07);
		background: $white;
		text-align: left;
		padding: 70px 50px;
		border-radius: 4px;
		@include media-breakpoint-down(lg){
		  padding: 35px 30px;
		}
		@include media-breakpoint-down(sm){
		  position: relative;
		  top: 0;
		  transform: translateY(0);
		  width: 100%;
		}
		.content-inner{
		  max-width: 480px;
		  margin: 0 auto;
		  @include media-breakpoint-down(sm){
			 max-width: 100%;
		  }
		  .title{
			 font-size: 45px;
			 color: $black;
			 font-family: $headings-font-family;
			 font-weight: 800;
			 line-height: 1.2;
			 @include media-breakpoint-down(lg){
				font-size: 30px;
			 }
		  }
		}
	 }
	 }
	 &.skin-v2{
	 position: relative;
	 margin-bottom: 20px;
	 text-align: left;
	 .image{
		position: relative;
		overflow: hidden;
		text-align: center;
		img{
			 @include transition(all 3s);
		}
	 }  
	 .box-content{
		background: $white;
		z-index: 1;
		@include transition(all 0.35s); 
		.title{
			 margin: 30px 0 0;
			 font-size: 20px;
			 color: $black;
		}
		.desc{
			 margin-top: 5px;
			 color: $body-color;
		}
		.read-more{
			 margin-top: 28px;
			 svg{
			 width: 20px;
			 height: auto;
			 fill: $theme-color;
			 }
		}
	 }
	 }
	 &.skin-v3{
	 position: relative;
	 margin-bottom: 20px;
	 text-align: left;
	 .image{
		position: relative;
		overflow: hidden;
		text-align: center;
		img{
			 @include transition(all 3s);
		}
	 }  
	 .box-content{
		background: $theme-color;
		z-index: 1;
		position: absolute;
		bottom: 20px;
		left: 30px;
		@include transition(all 0.35s);
		max-width: 280px;
		padding: 30px 45px;
		font-size: 18px;
		text-align: center; 
		.title{
			 margin: 0;
			 font-size: 40px;
			 color: $black;
			 a{
			 color: $white;
			 &:hover{
				text-decoration: underline;
			 }
			 }
		}
		.desc{
			 font-size: 18px;
			 color: $black;
		}
	 }
	 }
  &.skin-v4{
	 position: relative;
	 margin-bottom: 20px;
	 text-align: left;
	 padding: 30px 45px;
	 border: 1px solid $border-color;
	 @include media-breakpoint-down(lg){
		padding: 30px;
	 }
	 .image{
		position: relative;
		overflow: hidden;
		text-align: center;
		img{
			 @include transition(all 3s);
		}
	 }  
	 .box-content{
		background: $white;
		z-index: 1;
		@include transition(all 0.35s); 
		text-align: center;
		.title{
			 margin: 30px 0 0;
			 font-size: 20px;
			 color: $black;
			 line-height: 36px;
		}
		.desc{
			 margin-top: 5px;
			 color: $body-color;
		}
		.read-more{
			 margin-top: 28px;
			 svg{
			 width: 20px;
			 height: auto;
			 fill: $theme-color;
			 }
		}
	 }
  }
}