@import 'bootstrap.min.css';

::-webkit-scrollbar {
    width: 3px;
    height: 2px;
    }
    
::-webkit-scrollbar-track {
    background: #f1f1f100; 
    border-radius: 10px;
    }
    
::-webkit-scrollbar-thumb {
    background: #888; 
    border-radius: 10px;
    }
    
::-webkit-scrollbar-thumb:hover {
    background: #555; 
    }

    
    *{
        box-sizing: border-box;
    }
    body{
        margin: 0;
        padding: 0;
    }

    .hover:hover{
        cursor: pointer;
    }
    
    .section-header{
        opacity : 0.8;
        padding: 10px;
    }

    .icon{
        height : 50px;
        width : 50px;
        margin-left: auto;
        margin-right:auto;
    }

    .icon-sm{
        height : 20px !important;
        width: 20px !important;
    }

    .rotate90{
        transform: rotate(90deg);
    }
    .rotate180{
        transform: rotate(180deg);
    }
    .rotate270{
        transform: rotate(270deg);
    }

    .relative{
        position: relative;
    }

    .absolute{
        position : absolute;
    }

    .card-icon{
        height: 20px;
        width: 20px;
        border: 1px solid var(--info);
        border-radius: 50%;
        top: 0px;
        left: -10px;
    }

    .side-nav{
        background: linear-gradient(to right,rgba(0,0,0,0.8),rgba(0,0,0,0.3));
        height:0px;
        width: 80px;
        position: fixed;
        z-index: 10;
    }

    .side-nav.navActive{
        height:100vh;
        width: 100vw;
    }

    .side-nav-toggle{
        top:20px;
        left: 20px;
        height:40px;
        width: 50px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        z-index: 20;
    }
    .side-nav-toggle .bar{
        height: 5px;
        width : 100%;
        border-radius: 10px;
    }

    .side-nav-content{
        display:none;
    }
    .side-nav-content.show{
        display:flex;
        flex-direction: row;
        width : 250px;
    }

    .intro{
        height: 100vh;
        width : 300px;
    }

    /*custom css*/

    /* dropping nav */

    .nav-toggle-holder{
        display: none;
    }
    .nav-content-small{
        display:none;
    }

    @media screen and (max-width: 770px) {
    .nav-toggle-holder{
        display: flex;
    }
    .nav-content{
        display: none;
    }
    .nav-content-small{
        display:none;
    }
    .nav-content-small.active{
        display: block;
    }
  }

    :root{
        /*
        --c0:rgba(255, 255, 255,1);
        --c1 : rgba(0, 123, 255,1);
        --c1-50 : rgba(0, 123, 255,.5);
        --c2: rgba(0, 86, 179,1);
        --c3 : rgba(0, 98, 204,1);
        --c4 : rgba(0, 64, 133,1);
        --c5 : rgba(159, 205, 255,1);
        --c6 : rgba(184, 218, 255,1);
        --c7 : rgba(0, 39, 82,1);
        --c8 : rgba(204, 229, 255,1);
        --c9-50 : rgba(38,143,255,.5);
        --c10 : rgba(0, 92, 191,1);
        --c11 : rgba(0, 105, 217,1);
        --c12 : rgba(122, 186, 255,1);

        --c0:rgba(255,255,255,1);
        --c1:rgba(218,160,61,1);
        --c1-50:rgba(218,160,61,0.5);
        --c2:rgb(240, 183, 123);
        --c3:rgba(218,135,10,1);
        --c4:rgb(218, 175, 101);
        --c5:rgb(242, 200, 61);
        --c6:rgb(255, 226, 61);
        --c7:rgb(218, 183, 76);
        --c8:rgb(167, 125, 11);
        --c9-50:rgba(180, 114, 1, 0.5);
        --c10:rgb(252, 199, 129);
        --c11:rgba(218,142,23,1);
        --c12:rgb(223, 183, 61);
*/
        --c0:rgba(255,255,255,1);
        --c1:rgba(67,128,177,1);
        -c1-50:rgba(5, 117, 177, 0.5);
        --c2:rgba(67,137,177,1);
        --c3:rgb(51, 192, 253);
        --c4:rgb(49, 147, 208);
        --c5:rgb(67, 124, 171);
        --c6:rgb(163, 189, 194);
        --c7:rgb(171, 209, 234);
        --c8:rgb(89, 149, 234);
        --c9-50:rgba(30, 102, 218, 0.5);
        --c10:rgb(75, 121, 247);
        --c11:rgb(153, 172, 247);
        --c12:rgb(133, 175, 247);
    
    }

    .table-custom,.table-custom>td,.table-custom>th{background-color:var(--c6)}.table-custom tbody+tbody,.table-custom td,.table-custom th,.table-custom thead th{border-color:var(--c12)}.table-hover .table-custom:hover{background-color:var(--c5)}.table-hover .table-custom:hover>td,.table-hover .table-custom:hover>th{background-color:var(--c5)}


    .btn-custom{color:var(--c0);background-color:var(--c1);border-color:var(--c1)}.btn-custom:hover{color:var(--c0);background-color:var(--c11);border-color:var(--c3)}.btn-custom.focus,.btn-custom:focus{color:var(--c0);background-color:var(--c11);border-color:var(--c3);box-shadow:0 0 0 .2rem var(--c9-50)}.btn-custom.disabled,.btn-custom:disabled{color:var(--c0);background-color:var(--c1);border-color:var(--c1)}.btn-custom:not(:disabled):not(.disabled).active,.btn-custom:not(:disabled):not(.disabled):active,.show>.btn-custom.dropdown-toggle{color:var(--c0);background-color:var(--c3);border-color:var(--c10)}.btn-custom:not(:disabled):not(.disabled).active:focus,.btn-custom:not(:disabled):not(.disabled):active:focus,.show>.btn-custom.dropdown-toggle:focus{box-shadow:0 0 0 .2rem var(--c9-50)}

    .btn-outline-custom{color:var(--c1);border-color:var(--c1)}.btn-outline-custom:hover{color:var(--c0);background-color:var(--c1);border-color:var(--c1)}.btn-outline-custom.focus,.btn-outline-custom:focus{box-shadow:0 0 0 .2rem var(--c1-50)}.btn-outline-custom.disabled,.btn-outline-custom:disabled{color:var(--c1);background-color:transparent}.btn-outline-custom:not(:disabled):not(.disabled).active,.btn-outline-custom:not(:disabled):not(.disabled):active,.show>.btn-outline-custom.dropdown-toggle{color:var(--c0);background-color:var(--c1);border-color:var(--c1)}.btn-outline-custom:not(:disabled):not(.disabled).active:focus,.btn-outline-custom:not(:disabled):not(.disabled):active:focus,.show>.btn-outline-custom.dropdown-toggle:focus{box-shadow:0 0 0 .2rem var(--c1-50)}

    .badge-custom{color:var(--c0);background-color:var(--c1)}a.badge-custom:focus,a.badge-custom:hover{color:var(--c0);background-color:var(--c3)}a.badge-custom.focus,a.badge-custom:focus{outline:0;box-shadow:0 0 0 .2rem var(--c1-50)}

    .alert-custom{color:var(--c4);background-color:var(--c8);border-color:var(--c6)}.alert-custom hr{border-top-color:var(--c5)}.alert-custom .alert-link{color:var(--c7)}

    .list-group-item-custom{color:var(--c4);background-color:var(--c6)}.list-group-item-custom.list-group-item-action:focus,.list-group-item-custom.list-group-item-action:hover{color:var(--c4);background-color:var(--c5)}.list-group-item-custom.list-group-item-action.active{color:var(--c0);background-color:var(--c4);border-color:var(--c4)}

    .bg-custom{background-color:var(--c1)!important}a.bg-custom:focus,a.bg-custom:hover,button.bg-custom:focus,button.bg-custom:hover{background-color:var(--c3)!important}

    .border-custom{border-color:var(--c1)!important}

    .text-custom{color:var(--c1)!important}a.text-custom:focus,a.text-custom:hover{color:var(--c2)!important}


    .profileImage{
        max-height: 300px;
    }