body {
    min-width: 480px;
}

.row {
    padding: 5px;
    margin-left: 15px;
    margin-right: 15px;
}

.row-no-margin {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0px;
    margin-left: 0px;
    margin-right: 15px;
}

.btn-primary {
    background-color: royalblue !important;
}

.btn-light {
    background-color: #d9d9d9 !important;
}

.header {
    overflow: hidden;
    height: 97px;
    /*padding: 10px 10px;
    padding-bottom: 15px;*/
}

.g-borderbottom {
    -webkit-border-image: -webkit-linear-gradient(top, #f5f5f5 0%, #d9d9d9 98%) 0 0 100% 0/0 0 4px 0 stretch; /*first color is the top color, second color is the bottom*/
    /*border-bottom: 5px solid #d9d9d9;*/
}

.g-bordertop {
    -webkit-border-image: -webkit-linear-gradient(top, #d9d9d9 0%, #f5f5f5 98%) 100% 0 0 0/4px 0 0 0 stretch; /*first color is the top color, second color is the bottom*/
    /*border-top: 5px solid #d9d9d9;*/
}

#bannerImage {
    display: block;
    max-width: 100%;
    max-height: 100%;
    min-height: 180px;
}


.header-right {
    float: right;
}

.header-left {
    float: left;
}


.menu {
    background-color: #f5f5f5;
    -webkit-border-image: -webkit-linear-gradient(top, #f5f5f5 0%, #d9d9d9 60%) 0 0 100% 0/0 0 4px 0 stretch; /*first color is the top color, second color is the bottom*/
}

.reporttitle {
    padding: 10px;
    padding-left: 30px;
}

/*.reportname {
    clear: both;
    color: goldenrod;
    font-size: 22px;
    font-weight: 600;
    padding: 0px 3px;
}

.reportdescription {
    clear: both;
    color: #d9d9d9;
    font-size: 18px;
    font-weight: 600;
    padding: 0px 3px;
}*/


/*login screen css*/

.loginbanner {
    width: 100%;
    height: 480px;
    position: relative;
    background-image: url(../Images/transmission_banner_white.jpg);
    background-size: cover;
    background-position: center;
}

@media screen and (max-width: 510px) {
    .login-cropper {
        width: 100%;
        height: 260px;
        overflow: hidden;
        background-color: #f5f5f5;
        padding-left: 20px;
    }

    .login-circle {
        right: 0;
        padding-right: 2%;
    }

    .login-padding {
        padding-top: 0px;
        padding-left: 0px;
    }
}


@media screen and (min-width: 510px) {
    .login-cropper {
        width: 360px;
        height: 360px;
        position: relative;
        overflow: hidden;
        border-radius: 50%;
        border: solid;
        border-color: #d9d9d9;
        background-color: #f5f5f5;
    }

    .login-circle {
        position: absolute;
        right: 0;
        top: 12%;
        padding-right: 10%;
    }

    .login-padding {
        padding-top: 50px;
        padding-left: 65px;
    }
}


/*header profile and login/logout area*/

@media screen and (max-width: 890px) {
    .portaltitles {
        display: none;
    }
}

/*@media screen and (min-width: 1280px) {
    .profileicon {
        display: none;
    }
}

@media screen and (max-width: 1282px) {
    .profile {
        display: none;
    }

    .profileicon {
        display: table-caption;
        padding-top: 5px;
        padding-right: 25px;
    }
}*/


.image-cropper {
    width: 60px;
    height: 60px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    border: solid;
    border-color: #f5f5f5;
}

.profile-pic {
    display: inline-flex;
    height: 50% ;
    margin: 12px auto;
    margin-left: -25%;
    /*centers the image height: 100%;*/
    width: auto;
}


/*vertical lines*/
.vl {
    clear: both;
    color: goldenrod;
    font-size: 22px;
    font-weight: 900;
    padding: 0px 3px;
}

.vlblue {
    clear: both;
    color: royalblue;
    font-size: 22px;
    font-weight: 900;
    padding: 0px 3px;
}


hr {
    height: 4px;
    border: none;
    color: #000;
    background-color: #f5f5f5;
    width: 60%;
    text-align: center;
    margin: 10px auto 10px auto;
}

/*footer {
        text-align: center;
        font-size: smaller;
    }

    .footer2 {
        color: royalblue;
    }*/


.headercontainer {
    clear: both;
    height: 125px !important;
    min-height: 125px !important;
}

.ibyptlheader {
    clear: both;
    height: 125px !important;
    min-height: 125px !important;
}


#customerHeaderLogo {
    padding-right: 15px;
    padding-top: 27px;
    padding-bottom: 29px;
}

.reportname {
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    display: block;
    line-height: 1em; /* a */
    max-height: 2em; /* a x number of line to show (ex : 2 line)  */
}


.block-lightgreen{
    background-color:lightgreen;
    color:mediumseagreen;
}

.block-lightgray {
    background-color: lightgray;
    color: dimgray;
}

.block-lightred {
    background-color: pink;
    color: red;
}

.block-lightyellow {
    background-color: khaki;
    color: yellowgreen;
}