html {
    background-color: #FBFEFB;
    color:#0B0A0A;
    /*background-color: #FBFEFB; */
}
.top {
    padding-top:30px;
    padding-bottom:30px;
    min-height:20vh;
    background-color:#0B0A0A;
    color:#FF7900;
    text-transform: uppercase;
}

.br {
    border:1px solid red;
}
.content {
    /* background-color: #FBFEFB; */
    color:#000;
    min-height:70vh;
}
.navi {
    background-color: #F4F5F6;
    width:260px;
    box-shadow:0 0 5px #D3D6D9;
    min-height: 100vh !important;
}
.navi ul, li {
    padding:0px;
    margin:0px;
    list-style: none;
}
.navi ul {
    padding:10px;
}
.navi li {
    margin:5px;
}
.navi a, a:link, a:active {
    display:inline-block;
    width:100%;
    padding:5px 10px;
    color:#0B0A0A;
    text-decoration: none;
    transition: 0.5s;
}

.navi a:hover {
    color: #FF7900;
    cursor:pointer;    
}
.navi a.active {
    color:#FF7900;
}
.cx {
    color:#D3D6D9;
}
.vx {
    min-height: 70vh;
}

input {
    padding: 10px 15px;
    padding-top:8px;
    display: inline-block;
    border:1px solid #BEC2C6;
    border-bottom:3px solid #BEC2C6;
    border-radius: 7px;
    transition: 0.5s;
}
input:focus {
    outline: none;
    border-bottom:3px solid #FF7900;
}
.footer {
    min-height:20vh;
    background-color: #0B0A0A;
    color:#D3D6D9;
    margin-top:auto;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.footer .fs {
    padding-top:50px;
}
.copyright {
    letter-spacing: .075em;
    font-size:.875em;
    font-style: italic;
}
/* Color palette

    #FF7700 ; orange
    #38302E ; dark brown
    #E8EEF2 ; light blueish
**/