Onionr/static-data/www/shared/main/style.css

body{
    background-color: #2c2b3f;
    color: white;
}

a, a:visited{
    color: white;
}
.center{
    text-align: center;
}
footer{
    margin-top: 2em;
    margin-bottom: 0.5em;
}

body{
    margin-left: 3em;
    padding: 1em;
}
.onionrMenu{
    max-width: 25%;
    margin-left: 2%;
    margin-right: 10%;
    font-family: sans-serif;
}
.onionrMenu li{
    list-style-type: none;
    margin-top: 3px;
    font-size: 125%;
}
.onionrMenu li:hover{
    color: red;
}
.box {
    display: flex;
    align-items:center;
 }
 .logo{
    max-width: 20%;
    vertical-align: middle;
 }
 .logoText{
     font-size: 2em;
     margin-top: 1em;
     margin-left: 1%;
 }

 .logoText, h1, h2, h3{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
 }

 .main{
     min-height: 500px;
 }

.content{
    margin-top: 3em;
    margin-left: 0%;
    margin-right: 40%;
    background-color: white;
    color: black;
    padding-right: 5%;
    padding-left: 3%;
    padding-bottom: 2em;
    padding-top: 0.5em;
    border: 1px solid black;
    border-radius: 10px;
    min-height: 300px;
}
.content p{
    text-align: justify;
}
.content img{
    max-width: 35%;
}
.content a, .content a:visited{
    color: black;
}

.stats{
    margin-top: 1em;
    background-color: #0c1049;
    padding: 5px;
    margin-right: 45%;
    font-family: sans-serif;
}
.statDesc{
    background-color: black;
    padding: 5px;
    margin-right: 1%;
    margin-left: -5px;
}

.stats noscript{
    color: blue;
}

.statItem{
    padding-left: 10px;
    float: right;
    margin-right: 5px;
}

.warn{
    color: orangered;
}

@media only screen and (max-width: 640px) {
    .onionrMenu{
        margin-left: 0%;
    }
    body{
        margin-left: 0em;
    }
    .content{
        margin-left: 1%;
        margin-right: 2%;
    }
    .content img{
        max-width: 85%;
    }
    .stats{
        margin-right: 1%;
    }
    .statItem{
        float: initial;
        display: block;
    }
}

/*https://stackoverflow.com/a/16778646*/
.overlay {
    visibility: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    text-align:left;
    z-index: 1000;
    background-color: #2c2b3f;
    color: white;
 }

 .closeOverlay{
     background-color: white;
     color: black;
     border: 1px solid red;
     border-radius: 5px;
     float: right;
     font-family: sans-serif;
 }
 .closeOverlay:after{
     content: '❌';
     padding: 5px;
 }

 .btn, .warnBtn, .dangerBtn, .successBtn, .primaryBtn{
     padding: 5px;
     border-radius: 5px;
     border: 2px solid black;
 }
.warnBtn{
    background-color: orange;
    color: black;
}
.dangerBtn{
    background-color: #f44336;
    color: black;
}
.successBtn{
    background-color: #4CAF50;
    color: black;
}

.primaryBtn{
    background-color:#396BAC;    
}

.btn:hover{
    opacity: 0.6;
}

.openSiteBtn{
    padding: 5px;
    border: 1px solid black;
    border-radius: 5px;
}

.hidden{
    display: none;
}