@font-face {
font-family: "mr-eaves-sans", sans-serif;
font-weight: 400;
font-style: normal;
}
@font-face {
  font-family: "cronos-pro", sans-serif;
font-weight: 400;
font-style: normal;
}
@font-face {
    font-family: 'Titillium Web', sans-serif;
    font-size: 20px;
    color: rgba(40, 31, 35, 1);
}

body {
  background: #E7D8DB;
    font-family: 'Titillium Web', sans-serif;
font-weight: 400;
font-style: normal;
color: #1E201F;
font-size: 18px;
}
a:hover{font-style: italic;}
a {color:#1E201F;text-decoration: none;}
a:visited {color:#3354D;}
#ul {text-decoration: underline;}
.about_statement {position: absolute;bottom:1rem;padding-top:2rem;padding-left:2rem;padding-bottom:2rem;padding-left:2rem;}
.about_drawing img {display: block;width:100%;}
.about_drawing {position: absolute;width:40vw;top:1.5rem;right:1.5rem;}
#crono {font-family: "cronos-pro", sans-serif;}
#eave {font-family: "mr-eaves-sans", sans-serif;font-size: 22px;}
#about_title {position: absolute;
bottom: 84%;left: 11%;z-index: 100;}
#painting_title {position: absolute;
bottom: 78%;left: 35%;z-index: 100;}
#drawing_title {position: absolute;
bottom: 47%;left: 5%;z-index: 100;}
#collab_title {position: absolute;
bottom: 20%;left: 18%;z-index: 100;}
#projects_title {position: absolute;
  bottom: 5%;left: 44%;z-index: 100;}

#main_image {position: absolute;
top: 3rem; right:3rem;width:40%;
z-index: 1;}
#star_image {}
#sign {position: absolute;z-index: 1;left:calc(50vw - 400px);top:calc(50vh - 170px);}


.image_grid{display:grid;
margin-top:1rem;margin-left: calc(50vw - 47.5vh);grid-template-columns: 1fr;}
.image_grid img {width:95vh;display: block;}
#tall {width: 70vh;padding-left: 12.5vh;}
.text_holder {padding-top: 1rem;padding-bottom:2rem;}
.top_text {width:50vw;}
#project div {padding-bottom:1rem;}
#two img {width:35vw;float:left;}
#cover img {width:35vw;}
#collaborations {margin-left:14.5vw;}
#two img:nth-child(1) {padding-right:.5vw;}
#two img:nth-child(2) {padding-left:.5vw;}
#collab_text {width:71vw;}


@media screen and (max-width:767px) {
body {width:100vw;margin-left:0;margin-right:0;}
#main_image {width:100vw;top:25vh;right:0;}
#sign {left:50vw;top:70vh;width:50vw;}
#about_title {position: absolute;
left:80vw;top:5vw;z-index: 100;}
#painting_title {position: absolute;
top:20vw;left: 65vw;z-index: 100;}
#drawing_title {position: absolute;
top:35vw;left: 50vw;z-index: 100;}
#collab_title {position: absolute;
bottom: 25vw;left: 5vw;z-index: 100;}
#projects_title {position: absolute;
  bottom: 10vw; left: 35vw;z-index: 100;}
.about_drawing img {width:70vw;}
.about_drawing {left:calc(30vw - 1rem);top:5rem;}
.image_grid {margin-left:0;}
.image_grid img {width:100vw;display: block;}
#tall {width: 100vw;padding-left: 0vw;}
.text_holder {padding-left:1rem;padding-right:1rem;}
.about_statement {padding-top:10rem;}
#two img {width:90vw;clear:both;}
#collaborations {margin-left:0vw;}
#two img:nth-child(1) {padding-right:0vw;padding-bottom: 1rem;
padding-left:5vw;}
#two img:nth-child(2) {padding-left:5vw;}
#collab_text {width:90vw;padding-left:5vw;}
#cover img {padding-left:5vw;padding-bottom:1rem;width:90vw;
.top_text {width:90vw;padding-left:5vw;}
#project div {padding-bottom:1rem;}
}
@media screen and (max-width:375px) {
#main_image {top:28vh;}
.about_statement {position: relative;top:30vh;padding:2rem;}
.about_drawing img {width:70vw;}
.about_drawing {left:calc(30vw - 1rem);}
}