/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/



#container {
    width: 100%;
	margin: 0 auto;
}

.text-wrapper {
/*    position: absolute;*/
    display: block;
    float: left;
    margin: 0 auto;
    width: 100%;  
/*    outline: 1px solid black;*/
    
}

.text-wrapper p {
    font-size: 3vw;
     margin: 20px auto;
    
}

.ital {
    font-size: 3vw;
    font-style: italic;
    line-height: 1.55em;
}

/*
.mosaic-wrapper {
	float: right;
	outline: 1px solid black;
	width: 60%;
}
*/


/* Masonry grid */
.single-masonry {
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-column-gap: .5vw;
       -moz-column-gap: .5vw;
            column-gap: .5vw;
    -webkit-column-fill: initial;
       -moz-column-fill: initial;
            column-fill: initial;
	width: 100%;
}

/* Masonry item */
.single-masonry .single-brick {
    padding: 0;
    margin-bottom: 10px;
    margin-bottom: .5vw;
    display: inline-block;
    /* Fix the misalignment of items */
    vertical-align: top;
    /* Keep the item on the very top */
}

/* Masonry image effects */
.single-masonry .single-brick img {
    vertical-align: top;
    width: 100%;
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    /* Remove Image flickering on hover */
}


/* Masonry on tablets */
@media only screen and (min-width: 740px) and (max-width: 1024px) {
    .single-masonry {
        -webkit-column-count: 2;
           -moz-column-count: 2;
                column-count: 2;
    }
    
.mosaic-wrapper {
	float: right;
/*	outline: 1px solid black;*/
/*	width: 70%;*/
}
    
    .text-wrapper {
        float: left;
		width: 30%;
/*		padding-right: 5%;*/
	}
    
    
     .text-wrapper p {
    font-size: .75vw;
    margin-right: 20px;
    }
    
    .ital {
        font-size: .75vw;
    }

}

/* Masonry on big screens */
@media only screen and (min-width: 1025px) {
	
	.text-wrapper {
		width: 30%;
/*		padding-right: 5%;*/
	}
    
    .text-wrapper p {
    font-size: .9vw;
        margin-right: 20px;
}
    
    .ital {
        font-size: .9vw;
    }


    .single-masonry {
        -webkit-column-count: 3;
           -moz-column-count: 3;
                column-count: 3;
    }
}


/*
.text_wrapper h1,
.text_wrapper h2 {
    font-weight: 300;
    font-size: 1.75vw;
    margin: 0;
	}
*/

/*
.text_wrapper p {
    font-weight: 300;
    font-size: 1vw;
    margin: 10px 0px;
	}
*/



.project-link {
	text-transform: uppercase;
	font-size: 1.25em;
	margin: 30px 0;
	}

.project-link a {
	color: #AEAEAE;
	}

.project-link a:hover {
	color: #7F7F7F;
	}

.img-wrapper-stories {
    display: block;
    margin: 0 auto;
    width: 100%;
     
	}



