/* General Setting */

html{
    font-family:'Roboto',sans-serif;
}

a{
    color:black;
    font-weight:600;
    text-decoration: none;
}

a:hover, a:focus{
    color:#0096FF;
}

a:visited{
    color:rgb(50,50,50);
}

h2{
    font-weight:300;
    font-size:2.5em;
}

h4{
    font-weight:400;
    font-size:1.6em;
}


blockquote{
    font-size:2.5em;
    font-weight:500;
    width:83%;
    margin:auto;
    color:rgb(97, 97, 97);
    line-height:1.3em;
    margin-top:1em;
    margin-bottom:1em;
    border-top:rgb(150,150,150) solid 0.5px;
    border-bottom:rgb(150,150,150) solid 0.5px;
    padding-top:0.75em;
    padding-bottom:0.75em;
}


.text-emphasize{
    font-weight:600;
}

.text-link{
    font-weight:500;
    color:black;
    text-decoration: underline;
}


button{
    border:none !important;
}

button:after, button:active{
    border:none !important;
}


.navbar-light .navbar-toggler {
    color: transparent;
}

/* Nav Menu */
.text-header{
    font-family:'Roboto', sans-serif;
    font-weight:600;
    font-size:1.75em;
    letter-spacing: 8px;
}


/* Page - About */
.text-about{
    font-family:'Helvetica',sans-serif;
    font-weight:lighter;
    margin-top: 80px;

}

/* Page - Index */
.text-index-intro{
    font-family:'Roboto',sans-serif;
    color:rgb(80,80,80);
    font-size:1.2em;
    font-weight:300;
    line-height:1.8em;
    margin-top: 4em;
    margin-bottom:3em;

}

.text-index-headline{
    font-size:3em;
    font-weight:500;
    color:rgb(19, 19, 19);
    margin-bottom:1em;
    text-decoration: underline;
    text-decoration-color: rgb(153, 204, 34);
    text-decoration-thickness: 0.18em;
    text-underline-offset:0.1em;
}

.beep img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 20%;
}

.projectThumbnail{
    border:2px coral;
}


.thumbnail-overlay{
    position:absolute; 
    background-color:rgba(100,100,100,0)k; 
    top:0; 
    bottom:0; 
    left:0; 
    right:0;
    color:rgba(50,50,50,0);
    font-size:1.2em;
    font-weight:300;
    text-align:center;
    padding-top:30%;
    transition-property: background-color,color;
    transition-duration:0.5s;
}

.thumbnail-overlay:hover{
    background-color:rgba(117, 125, 138, 0.7);
    color:rgb(233, 233, 233);
}

.project_list a{
    color:rgb(167, 167, 167);
    font-size:1.2em;
    transition-property:color;
    transition-duration:0.5s;
}

.project_list a:hover{
    color:rgb(39, 39, 39);
}

/* Page - projects/design */
.project-cover img{
    margin-top:2em;
    margin-bottom:2em;
    margin-left:0;
    width: 100%;
    height:550px;
    object-fit:cover;
}

@media screen and (max-width: 576px) {
    .project-cover img{
        height:350px;
    } 
  }



p, li{
    font-weight:300;
    font-size:0.95em;
    line-height:1.6em;
    color:rgb(50,50,50);
}

.p_larger{
    color:black;
    font-weight:300;
    font-size:1.5em;
    font-style: italic;
}


.project_title_annotate_larger{
    font-weight:300;
    font-size:1.3em;
    color:rgb(133, 133, 133);
}


.project_title_annotate{
    color:rgb(100,100,100);
}

a-scene {
    height: 100%;
    width: 100%;
  }


/* Page - blog */

.blog img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height:250px;
}

.blog h4{
    font-size:0.9em;
    font-weight:600;
    color:rgb(71, 71, 71);
}


.blog a{
    display:block;
    font-size:1.6em;
    font-weight:600;
    margin-top:1em;
    margin-bottom:1em;
    text-decoration: none;
}

.blog p{
    font-size:0.9em;
}

.topics{
    font-size:0.9em;
    line-height:1.5em;
}