/* COLORIST GRID */

.colourist-grid-desktop{
	display:none;
}

.colourist-grid-mobile{
    display:block;
    margin:1.6625rem 0 0 0;
}

.colourist-grid-mobile .colourist-grid-item{
    background-position:center center;
    background-repeat: no-repeat;
    background-size:cover;
    display:block;
    height:51.25vw;
    margin:0.7rem 0;
	overflow: hidden;
    position:relative;
    text-decoration:none;
}

.colourist-grid-mobile a.colourist-grid-item{
    opacity:0;
    transition:opacity 0.25s;
}

.colourist-grid-mobile a.colourist-grid-item.animate{
    opacity:1;
}

.colourist-grid-mobile .colourist-grid-item span{
    top:1rem;
    color:var(--font-color-light-3);
    font-family:var(--font-1-regular);
    font-size:1.225rem;
    display:block;
    right:1rem;
    line-height:0.92857em;
    position:absolute;
	text-align:right;
	text-transform:uppercase;
    width:50%;
}

@media only screen and (min-width:38rem){

    .colourist-grid-mobile{
        margin:2.375rem 0 0 0;
    }

    .colourist-grid-mobile .colourist-grid-item{
        height:51.25vw;
        margin:1rem 0;
    }

    .colourist-grid-mobile .colourist-grid-item span{
		top:1.25rem;
        font-size:1.75rem;
		right:1.25rem;
    }

}

@media only screen and (min-width:48rem){

    .colourist-grid-mobile{
		display:none;
    }

}


@media only screen and (min-width:48rem){

    .colourist-grid-desktop{
		align-items: flex-start;
        display:flex;
		flex-wrap:wrap;
		justify-content: space-between;
        margin:2.375rem 0 0 0;
    }
    .colourist-grid-desktop.col-6{
        gap:0 10px;
		justify-content:flex-start;
    }

    .colourist-grid-desktop a.colourist-grid-item{
        background-position:center center;
        background-repeat: no-repeat;
        background-size:cover;
        display:block;
        margin:0 0 10px 0;
        overflow:hidden;
        position:relative;
        text-decoration:none;
    }

    .colourist-grid-desktop a.colourist-grid-item{
        opacity:0;
        transition:opacity 0.25s;
    }
    
    .colourist-grid-desktop a.colourist-grid-item.animate{
        opacity:1;
    }

    .colourist-grid-desktop.col-2 a.colourist-grid-item{	
		--flex-gap: 10px;
		--flex-items:2;
        height:510px;
		width:calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	}
    .colourist-grid-desktop.col-3 a.colourist-grid-item{	
		--flex-gap: 10px;
		--flex-items:3;
		/*height:51.25vw;*/
        height:510px;
		width:calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	}
	.colourist-grid-desktop.col-4 a.colourist-grid-item{	
		--flex-gap: 10px;
		--flex-items:4;
        height:510px;
		width:calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	}
	.colourist-grid-desktop.col-5 a.colourist-grid-item{	
		/*height:35vw;*/
        height:510px;
		--flex-gap: 10px;
		--flex-items:5;
		width:calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	}
    .colourist-grid-desktop.col-6 a.colourist-grid-item{	
		--flex-gap: 10px;
		--flex-items:3;
        height:510px;
		width:calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	}


    .colourist-grid-desktop .colourist-grid-item span{
        top:1.75rem;
        color:var(--font-color-light-3);
        font-family:var(--font-1-regular);
        font-size:1.5rem;
        display:block;
        right:1.25rem;
        line-height:0.9166em;
        position:absolute;
		text-align:right;
		text-transform: uppercase;
    }

    .colourist-grid-desktop .colourist-grid-item .video{
        bottom:0;
        display:none;
        left:0;
        overflow:hidden;
        position:absolute;
        right:0;
        top:0;
    }

    .colourist-grid-desktop a.colourist-grid-item:hover .video{
        display:block;
    }

    .colourist-grid-desktop a.colourist-grid-item .video video{
        display:block;
        height:102%;
        width:auto;
    }

}