.image-box{
	&.caption {
		position: relative;
		img {
			width: 100%;
		}
		p {
			position: absolute;
			padding: 20px 40px 20px 20px;
			margin: 0;
			min-width: 50%;
			max-width: 80%;
			color: #fff;

			&.caption--right-bottom {
				bottom: 0;
				right: 0;
			}

			&.caption--left-bottom {
				bottom: 0;
				left: 0;
			}

	        @each $category, $color in $categories {
	            .#{$category} & {
	                background-color: $color;
	            }
	        }
		}
	}
}

.row-compromissos {

	height: 89px;
	background-color: #fff;

	h3 {
		margin-top: 30px;
	}

	.col-sm-12 {
		display: inline-block;
	}

	.icon-wrapper {
		width: 61px;
	    height: 61px;
	    float: left;
	    border-radius: 100%;
	    margin: 14px 14px 14px 0;
	}

	.icon {
		position: relative;
	    top: 7px;
	    left: 11px;
	}

    @each $category, $color in $categories {
        .#{$category} & {
            color: $color;

	        .icon-wrapper {
	        	background-color: $color;
	        }
        }

    }
}