.logo {
    svg,
    h1 {
        vertical-align: middle;
    }
    h1 {
        color: $primary-color;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom: 0;
    }

    &:after {
        content: none;
    }

    &.logo--inline {
	    svg,
	    h1 {
	        display: inline-block;
	    }
	    h1 {
	        font-size: 16px;
	        display: none;
	    }
	}

	&.logo--large {
	    @extend .animated;
	    @extend .fadeIn;
	    text-align: center;

	    h1 {
	        font-size: 26px;
	    }

	    svg {
	        width: 100px;
	        height: 100px;
	    }
	}

	&.logo--small {
		text-align: center;

	    h1 {
	        font-size: 26px;
	    }

	    svg {
	        width: 50px;
	        height: 50px;
	    }
	}
}