.app-name{ font-size: 2em; font-weight: bold; margin: 20px 10px; float: left;}
.username-span > span { margin-right: 10px;}
.username-span{  font-size: 1.1em; float: right; margin: 10px;}
.menu{ width: 100%; float: right; height: 42px; position: fixed; z-index: 100; background-color: white; border-bottom: 1px solid #dadada;}
header .header{ box-sizing: border-box; background: #232E78; color: white; padding: 0px 10px; width: 100%; float: left; position: relative; clear: both; overflow: visible; height: 70px;}
footer{ float: right; display: block; width: 100%; height: 70px; background-color: #f0f0f0; margin-top: 100px; position: relative; text-align: center; padding: 10px; border-top: 1px solid #dadada; font-size: 0.9em;}
html{ overflow-x: hidden; width: 100%; height: 100%;}
a, a:hover, a:focus{ text-decoration: none;}
body{ margin:  0 0 0 0; padding: 0 0 0 0; font-size: 16px; font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif; font-weight: 300; width:100%; height:100%; background-color: #f0f0f0; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.login-sidebar { padding: 0px; margin-top: 0px; }
.login-sidebar .login-card {left: 0px;position: absolute;height: 100%;padding: 20px;box-shadow: 6px 1px 10px #00000052;}
.login-card label { font-size: 20px; font-weight: 300; }

.card {position: relative; width: 330px; background-color: #FFFFFF;background-clip: border-box;border: 1 solid #cccccc;border-radius(5px);}
.card > hr { margin-right: 0; margin-left: 0;}

.form-signin .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px;
  font-size: 16px;
}

header{ position: fixed; z-index: 100; top: 0; float: left; clear: both; width: 100%; box-sizing: border-box;}
#id_container_content{ position: absolute; top: 69px; right: 0; margin: 0 0 0 0; width: 100%; z-index: 0; height: auto; background-color: white; display: block; border-top: 1px solid #dadada;}
#id_subcontainer_content{ position: relative; padding: 50px 25px;
/*   width: 100%; */
  z-index: 0; overflow: auto; min-height: 400px; display: block; top: 0; overflow-x: hidden;}
.icon-home-menu{ width: 25px; height: 30px;}
.icon-login-menu{ width: 20px; height: 27px;}
.align-icons{ margin-top: 4px;}
#id_logout:hover{ opacity: 0.8;}
.user-options{ color: #4FBDEB; height: 42px; width: 400px; float: right;}
#id_user_name{ float: right; padding: 0px 10px 7px 10px; top: -2px; position: absolute; font-size: 13px;}
.log{ float: right; padding: 7px 12px 7px 12px; transition: 0.5s; color: #001781;}
.log:hover{ opacity: 0.8;}
.home{ float: right; transition: 0.5s; padding: 7px 10px 7px 10px; height: 100%; margin-right: 0px:}
.login-background { display:none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; }
#login_form .alert { max-width: 290px; }

.alert.alert-danger.alert-dismissable.fade.in.danger-style {
    background-color: #ebc000 !important;
    color: #00358e !important;
    border-color: #d4d800 !important;
}
@media (min-width: 767px) {

  @keyframes fadeInRight{
      0%{opacity:0;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);-o-transform:translateX(30px);transform:translateX(30px)}
      100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}
    }


}  .fadeInRight{-webkit-animation-name:fadeInRight;-o-animation-name:fadeInRight;animation-name:fadeInRight}

  .login-card {
    -webkit-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeInRight;
    -o-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }

  @media (max-width: 767px) {
    .login-card {
      width: 100%;
    }
    nav .navbar {
      display: none;
    }

    @keyframes fadeInRight{
        0%{opacity:0;}
        100%{opacity:1;}
      }
  }
