.inspiration {
    margin-top: 20px;
    margin-bottom: 20px;
    &__box {
        display: flex;
        @extend %flexStartStart;
        background: rgba($grey, 0.2);
        @include size(100%,100%);
        flex-direction: column;
        position: relative;
        padding-bottom: 20px;
    }
    .reveal {
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        @include size(100%,$contestIconBox);
        z-index: 10;
        .action--square {
            position: absolute;
            top: 0;
            right: 0;
            display: flex;
            @extend %flexCenterCenter;
            @include size($contestIconBox,$contestIconBox);
            transition: 180ms linear;
        }
        &__label {
			position: absolute;
            top: 0;
            display: flex;
            @extend %flexCenterCenter;
            @include size(calc(100% - 30px), $contestIconBox);
            background: rgba($black, 0.5);
            color: $white;
            text-align: center;
            transition: 180ms linear;
            opacity: 0;
            pointer-events: none;
		}
        &.right {
            .action--square { right: 0; }
            .reveal__label { right: $contestIconBox; }
        }
        &.left {
            .action--square { left: 0; }
            .reveal__label { left: $contestIconBox; }
        }
        &:hover {
            .reveal__label { opacity: 1; }
        }
    }
    &__img {
        display: block;
        width: 100%;
        img { width: 100%;}
    }
    &__info {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 0 20px;
        &-title {
            font-weight: $fBlack;
            font-size: 1.4em;
            margin: 20px 0 40px;
            color: $red;
            text-align: center;
            small {
                font-family: $text;
                font-size: 0.6em;
                color: $black;
            }
        }
        &-description {
            text-align: justify;
            text-align-last: center;
        }
    }
    &.add-new {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        .plus {
            display: block;
            background: $red;
            width: 100%;
            height: 0;
            padding-bottom: 100%;
            margin-bottom: 20px;
            position: relative;
            @extend %arrowClose;
            &:before,
            &:after {
                background: $white;
                @include size(90px,20px);
                border-radius: 20px;
            }
            &:before { transform: translate(-50%,-50%) rotate(0deg); }
            &:after { transform: translate(-50%,-50%) rotate(90deg); }
        }
        .inspiration__info-title { color: $black; line-height: 1em;}
    }
    @media (max-width: 1200px) {
        width: 31%;
    }
    @media (max-width: 1023px) {
        width: 48%;
    }
    @media (max-width: 767px) {
        width: 94%;
        margin: 20px 3%;
    }
}