.ct-info-box {
	&.layout1 {
		.item--icon {
			overflow: hidden;
			width: 70px;
			height: 70px;
			min-width: 70px;
			max-width: 70px;
			@include border-radius(70px);
			background-color: rgba( $primary_color, 0.2);
			color: $primary_color;
		    display: flex;
		    align-items: center;
		    justify-content: center;
		    margin-right: 20px;
		    @media #{ $max-lg} {
		    	margin-bottom: 25px;
		    }
			i, img {
				@include transition(all 300ms linear 100ms);
			}
			i {
				font-size: 35px;
			}
			img {
				max-height: 35px;
			}
		}
		.item--title {
			margin-bottom: 8px;
			color: #000;
			font-size: 24px;
			@media #{ $max-lg} {
				font-size: 18px;
			}
		}
		.sub-title {
			color: $secondary_color;
		}
		.meta-box {
			@media #{ $min-xl} {
			    display: flex;
			    align-items: center;
			}
		    margin-bottom: 30px;
		}
		.list-row {
			list-style: none;
			margin-bottom: 0;
			li {
				line-height: 24px;
				font-size: 16px;
				color: $secondary_color;
				font-weight: 500;
				a {
					color: $secondary_color;
					&:hover {
						color: $primary_color;
					}
				}
				+ li {
					margin-top: 7px;
				}
			}
		}
		.inner-box {
			@include box-shadow(0 3px 15px rgba(#0c0c0c, 0.09));
			padding: 30px;
			@include border-radius(10px);
			&:hover {
				.item--icon {
					&.icon-bounce {
						img, i {
							@include animation(icon-bounce 0.5s linear 1);
						}
					}
					&.icon-bounce-right {
						img, i {
							@include animation(icon-bounce-right 0.5s linear 1);
						}
					}
					&.icon-shakeThatBooty {
						img, i {
							@include animation(shakeThatBooty 0.3s linear 1);
						}
					}
					&.icon-right-from-Left {
						img, i {
							@include animation(toRightFromLeft 0.3s linear 1);
						}	
					}
					&.icon-flipX {
						img, i {
							@include animation(flipX 0.3s linear 1);
						}		
					}
					&.icon-Scale-Delay {
						img, i {
							@include animation(ct-cubeGridScaleDelay 0.9s linear 1);
						}			
					}
				}
			}
		}
	}
	&.layout2 {
		.item--icon {
			@media #{ $min-lg } {
				min-width: 99px;
				max-width: 99px;
				text-align: center;
			}
			overflow: hidden;
			padding-top: 5px;
			padding-bottom: 5px;
			@media #{ $max-md } {
				margin-bottom: 10px;
			}
			i, img, svg {
				@include transition(.3s cubic-bezier(.24,.74,.58,1));
			}
			i {
				display: inline-flex;
				align-items: center;
				line-height: 1;
				color: $primary_color;
				font-size: 40px;
				@media #{ $min-lg } {
					justify-content: center;
				}
			}
		}
		.item--meta {
			ul {
				margin-bottom: 0;
				list-style: none;
				li {
					font-size: 14px;
					color: #0e0e0e;
					+ li {
						margin-top: 5px;
					}
					a {
						color: #0e0e0e;
						&:hover {
							color: $primary_color;
						}
					}
				}
			}
		}
		.inner-box {
			padding: 35px 20px;
			background-color: #eeeeee;
			position: relative;
			@media #{ $min-lg } {
				display: flex;
				align-items: center;
			}
			&:after {
				-webkit-transition-delay: 500ms;
				content: "";
				display: inline-block;
				bottom: -15px;
				height: 15px;
				background-color: #faa80a;
				position: absolute;
				left: 50%;
				width: 85%;
				@include transform(translateX(-50%) scaleX(0));
				opacity: 0;
				@include transition(.3s cubic-bezier(.24,.74,.58,1));
			}
			&:hover {
				&:after {
					@include transform(translateX(-50%) scaleX(1));
					opacity: 1;
				}
				.item--icon {
					&.icon-bounce {
						img, i {
							@include animation(icon-bounce 0.5s linear 1);
						}
					}
					&.icon-bounce-right {
						img, i {
							@include animation(icon-bounce-right 0.5s linear 1);
						}
					}
					&.icon-shakeThatBooty {
						img, i {
							@include animation(shakeThatBooty 0.5s linear 1);
						}
					}
					&.icon-right-from-Left {
						img, i {
							@include animation(toRightFromLeft 0.5s linear 1);
						}	
					}
					&.icon-flipX {
						img, i {
							@include animation(flipX 0.5s linear 1);
						}		
					}
					&.icon-Scale-Delay {
						img, i {
							@include animation(ct-cubeGridScaleDelay 0.9s linear 1);
						}			
					}
				}
			}
			&.layout-active {
				&:after {
					@include transform(translateX(-50%) scaleX(1));
					opacity: 1;
				}
			}
		}
	}
}