body{
    min-height: 100vh;
    background-image: url("../images/background.png");
    -webkit-background-size: cover;
}
.page-body{
    min-height: 1070px;
}

.bg-blue{
    background-color: #1167b1;
}
.bg-sky{
    background-color: #2a9df4;
}
.bg-soft{
    background-color: #d0efff;
}
.bg-gray{
    background-color: #f4f3f3;
}
.bg-s{
    background-color: #ECFEFF;
}

.text-blue{
    color: #1167b1;
}
.text-sky{
    color: #2a9df4;
}
.text-strong{
    color: #022954;
}
.text-soft{
    color: #d0efff;
}
.text-gray{
    color: #f4f3f3;
}
.text-brown{
    color:#e6ac00;
}

.banner-top{
    height: 150px;
    background-image: url("../images/banner-top.png?id=2");
    -webkit-background-size: cover;
    background-size: 100% 100%;
}
.banner{
    height: 300px;
    background-image: url("../images/banner.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;

    position: relative;
}
.banner-menu{
    position: absolute;
    right: 1%;
    z-index: 1;
    top: -25px;
}
.banner-menu a{
    color: white;
    background-color: #2a9df4;
    border-top: 4px solid #d0efff;
    border-bottom: 4px solid #f4f3f3;
}
.banner-menu a:hover{
    color: #f4f3f3;
    background-color: #1167b1;
}
.banner-menu a.active{
    color: #f4f3f3;
    font-weight: bolder;
    background-color: #022954;
}
.banner-f-radius{
    border-bottom-left-radius: 25px;
    padding-left: 25px!important;
    border-bottom: solid 2px;
}
.banner-e-radius{
    border-top-right-radius: 25px;
    padding-right: 25px!important;
}

.block-bottom{
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom: 4px solid #1167b1;
}

.block-h-bars{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-bars.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-user{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-user.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-users{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-users.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-signal{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-signal.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-share{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-share.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-calender{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-calender.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-graph{
    width: 100%;
    height: 50px;
    left: -3px;
    top: -30px;
    background-image: url("../images/icon-graph.png");
    -webkit-background-size: cover;
    background-size: 100% 100%;
    position: absolute;
    text-align: center;
}
.block-h-bars span,
.block-h-user span,
.block-h-users span,
.block-h-signal span,
.block-h-share span,
.block-h-calender span,
.block-h-graph span
{
    top: 10px;
    font-weight: bolder;
    color: white;
    position: relative;
}

.block-border{
    border: 3px solid #1167b1;
    border-radius: 20px;
    padding-bottom: 15px;
    max-width: 500px;
    margin: auto;
}
.block-border a{
    color: #f4f3f3;
    padding-bottom: 0;
    padding-top: 0;
}
.block-border a:hover{
    color: #f4f3f3;
    background-color: #1167b1;
}

.block-menu{
    margin-top: 40px;
    padding-top: 40px;
    border: 3px solid #1167b1;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    padding-bottom: 15px;

    position: relative;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.7) !important;
}
.block-menu a{
    color: #f4f3f3;
    padding-bottom: 0;
    padding-top: 0;
    padding-right: 0;
}
.block-menu a:hover{
    color: #f4f3f3;
    background-color: #1167b1;
}
.block-menu a.active{
    color: #f4f3f3;
    font-weight: bolder;
    background-color: #022954;
}

.block-comment{
    border: 2px solid #1167b1;
    border-radius: 10px;
    padding-bottom: 15px;
    max-width: 500px;
    margin: auto;
    background-color: #d0efff;
}
.block-register{
    border: 2px solid #1167b1;
    border-radius: 10px;
    padding-bottom: 15px;
    max-width: 600px;
    margin: auto;
    background-color: white;
}

.footer-block{
    position: relative;
}
.footer-image{
    top: -185px;
    position: absolute;
}

.list-group-view{}
.list-group-view:hover{
    cursor: pointer;
    border-radius: 5px;
    border: 1px solid #d0efff;
    background-color: rgba(208,239,255,0.7);
}

.card-view{}
.card-view:hover{
    cursor: pointer;
    border: 1px solid #2a9df4;
    opacity: 0.7;
}

.shadow-custom{
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.7) !important;
}

.img-link:hover{
    border: 2px solid #1167b1;
}
.a-none{
    text-decoration: none!important;
}
.c-pointer{
    cursor: pointer;
}
.c-hover-soft:hover{
    background-color: #d0efff;
}
.menu-h-page{
    border-radius: 20px;
    background-color: #022954;
}

@media (max-width: 992px) {
    .footer-image{
        display: none;
    }
}
@media (max-width: 770px) {
    .container{
        padding: 0;
    }
    .banner-top {
        height: 80px;
        background-image: url("../images/banner-top-sm.png?id=2");
    }
    .banner{
        height: 260px;
        background-image: url("../images/banner-sm.png");
    }
}



/*custom button*/
.btn-brown{color:#fff;background-color:#e6ac00;border-color:#e6ac00}
.btn-brown:hover{color:#fff;background-color:#cc9900;border-color:#cc9900}
.btn-brown.focus,.btn-brown:focus{box-shadow:0 0 0 .2rem rgba(255,193,7,.5)}
.btn-brown.disabled,.btn-brown:disabled{color:#fff;background-color:#e6ac00;border-color:#e6ac00}
.btn-brown:not(:disabled):not(.disabled).active,
.btn-brown:not(:disabled):not(.disabled):active,.show>.btn-brown.dropdown-toggle{color:#fff;background-color:#e6ac00;border-color:#e6ac00}
.btn-brown:not(:disabled):not(.disabled).active:focus,
.btn-brown:not(:disabled):not(.disabled):active:focus,
.show>.btn-brown.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(255,193,7,.5)}


.btn-outline-brown{color:#cc9900;border-color:#cc9900}
.btn-outline-brown:hover{color:#fff;background-color:#e6ac00;border-color:#e6ac00}
.btn-outline-brown.focus,.btn-outline-brown:focus{box-shadow:0 0 0 .2rem rgba(255,193,7,.5)}
.btn-outline-brown.disabled,.btn-outline-brown:disabled{color:#e6ac00;background-color:transparent}
.btn-outline-brown:not(:disabled):not(.disabled)
.active,.btn-outline-brown:not(:disabled):not(.disabled):active,
.show>.btn-outline-brown.dropdown-toggle{color:#fff;background-color:#e6ac00;border-color:#e6ac00}
.btn-outline-brown:not(:disabled):not(.disabled).active:focus,
.btn-outline-brown:not(:disabled):not(.disabled):active:focus,
.show>.btn-outline-brown.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(255,193,7,.5)}