#rin-main{
    display: flex;
    width: 95%;
    margin: auto;
    height: 100vh;
    max-width: 1200px;
    justify-content: center;
    flex-flow: column nowrap;
}
@media(max-height:777px){
    #rin-main {
     height: auto;
    }
   }
.rin-card{
    margin: 20px 0;
    padding:20px 25px;
    padding-bottom:0;
    background-color: rgba(66,66,66,.3);
}
.rin-card-title{
    font-size: 30px;
    color:white;
    margin-bottom: 15px;
}
.rin-card-title2{
    font-size: 20px;
    color:white;
    margin-bottom: 5px;
}
.rin-card-content{
    font-size: 17px;
    color:white;
    margin-bottom: 5px;
    line-height:1.5;
}
.rin-card-title2 a{
    text-decoration:none;
}
.rin-card-part{
    margin-bottom: 15px;
    margin-top: 10px;
}
.mdui-progress{
    background-color: rgba(255,255,255,.2)!important;
}
.mdui-progress-determinate{
    background-color: rgb(255,255,255)!important;

}
.mdui-tooltip{
    margin-top:10px!important;
}
.rin-btn {
    color:white;
    margin-right: 10px;
    min-width:100px!important;
}
@media only screen and (min-width: 321px) and (max-width: 1024px) {
    .rin-btn {
        margin-bottom: 10px;
    }
}
.rin-btn-blue{
    border-bottom: 1.5px solid #28A9E0;
}
.rin-btn-blue:hover{
    background-color: #28A9E0;
    transition: all .3s;
}
.rin-btn-pink{
    border-bottom: 1.5px solid #F9A2A8;
}
.rin-btn-pink:hover{
    background-color: #F9A2A8;
    transition: all .3s;
}
.rin-btn-black{
    border-bottom: 1.5px solid #353535;
}
.rin-btn-black:hover{
    background-color: #353535;
    transition: all .3s;
}
.rin-tr{
    margin-top:40px;
    margin-bottom:20px;
}
#last {
    text-align: center;
}
#last .rin-card-title2{
    letter-spacing : 10px;
    margin-bottom: 10px;
}
#last .rin-card-content{
    font-size: 12px;
    letter-spacing: 1em;
    opacity: .5;
}
#footer{
    text-align: center;
}
#footer .rin-card-content{
    font-size: 12px;
    opacity: .5;
}
#footer div a {
    color: #2196f3;
    font-weight: 700;
    transition: all .3s;
    text-decoration: none;
}