/* position end define graphic html component in Header */
header {
    font-family:Calibri;
    height:100px;
}


.logoHeight {
    height:50px;
}

    header .headerText {
        font-size:25px;
    line-height:50px;
    font-weight :bold;
}

    header .HeaderLogoDiv img {
        position:relative;
        top:50%; 
        transform: translateY(-50%);
        max-height:100%; 
        margin:0px auto;
        bottom:0px;
    }

    header #leftLogo {
        position:relative;
        top:50%;
        transform:translateY(-50%);
    }
    header #rightLogo {
        position:relative;
        top:50%;
        transform:translateY(-50%);
    }


/*user information div*/
    #userDefinitionDiv {
        margin-bottom:5px;
    }

    #userDefinitionDiv .textEmploye {
        float:right;
        margin:0px 10px;
        line-height:24px;        
    }

    #userDefinitionDiv .textDatabase {
        float:left;
        margin:0px 6px;
        line-height:24px; 
        font-weight: bold;
    }

    #userDefinitionDiv .Button_logoff {
        float:right;
        background:white;
        line-height:20px;
        border:1px solid black;
    }

    #userDefinitionDiv .Button_logoff:hover {
        box-shadow:inset 0px 0px 1px 1px gray;
    }

    #userDefinitionDiv .Button_zeroSize {       
        padding: 0px;
        margin: 0px;
        border: 0px;
        width: 0px;
        height: 0px;
    }
/* Media setting from device */



/*for small media*/
@media screen and (min-width: 768px) {
    header {
        height: 100px;
    }


    .logoHeight {
        height: 100px;
    }

    header .headerText {
        font-size: 30px;
        line-height: 100px;
        font-weight: bold;
    }
}

/*for  Tablets*/
@media screen and (min-width: 992px) {
    header {

    }

}

/*for Laptops and Desktop*/
@media screen and (min-width: 1200px) {
    header {
        
    }
}