body{
    font-family: Helvetica, Roboto, Arial, sans-serif;
    line-height:1.5;
    background:#fbfaf9;
    font-size:17px;
    color:#131313;
}

a {
    color: #354da6;
    text-decoration:none;
}

a:hover {
    text-decoration:underline;
    /* color:#05467d; */
}

* > :first-child { 
    margin-top: 0 !important;
}


.content{
    padding:20px;
    padding-bottom:10px;
    /* background:#eeeeee; */
    width:60%;
    max-width:800px;
    margin-left:auto;
    margin-right:auto;
    /* border:2px solid black; */
    /* box-shadow: 15px 15px 0px #686868; */
    box-sizing:border-box;
}

.center{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.flex-container{
    display:flex;
    flex-wrap:wrap;
    padding-top:15px;
}

.section-title{
    font-size:20px;
    font-weight:bold;
    width:20%;
    padding-right:15px;
    box-sizing:border-box;
}

.section-content{
    width:80%;
}

.full-width-content{
    width:100%;
}

.no-margin-top{
    margin-top:0;
}

.no-margin-bottom{
    margin-bottom:0px;
}

.no-padding-top{
    padding-top:0px;
}

.main-title{
    font-size:30px;
    padding-top:10px;
    padding-bottom:10px;
    font-weight:bold;
}

.main-title-wrapper {
    margin-top:10px;
    text-align:center;
}

.dot-span{
    padding-left:5px;
    padding-right:5px;
}

#image-wrapper{
    width:80vw;
    max-width:350px;
    /* Multiplier equal to image width/height */
    height: calc(80vw * .66747154191); 
    max-height: 233.6px;
    margin-left:auto;
    margin-right:auto;
}

img {
    display:block;
}

.mobile-only{
    display:none;
}

.main-hr{
    border-top:1px solid #505050;
    margin-top:25px;
    margin-bottom:25px;
}

#github-link{
    text-align:right;
}

@media (max-width:1150px){
    .content{
        width:85%;
    }

}

@media (max-width:760px){
    body{
        font-size:16px;
    }
    .content{
        width:100%;
        box-shadow: none;
    }
    .section-title{
        width:100%;
        padding-left:0;
        padding-bottom:10px;
    }
    
    .section-content{
        width:100%;
    }

    .flex-container{
        padding-top:10px;
    }

    .first-dot{
        display:none;
    }

    .mobile-only{
        display:inline;
        padding-bottom:5px;
    }

    .main-title{
        padding-bottom:0px;
    }
}


/* All touchscreens */
@media (any-pointer: coarse) {
    a:hover {
       text-decoration:none;
       color: #0964b0;
    }
  }