se-hub/templates/css/theme.css

@import url(http://fonts.googleapis.com/earlyaccess/alefhebrew.css);

body{
  font-family: "Alef Hebrew",
  “Helvetica Neue”,
  Helvetica,
  Arial,
  sans-serif;
}

.menuBtn {
  background-color: transparent;
  border: none;
  height: 38px;
  margin: 16px 0 0 16px;
  width: 36px;
}
md-toolbar h1 {
  font-weight: normal;
}
md-list .md-button {
  color: inherit;
  font-weight: 500;
  text-align: left;
  width: 100%;
}

.welcome-logo-banner{
  width: 100%;
}

/* Using Data-URI converted from svg until <md-icon> becomes available
https://github.com/google/material-design-icons
*/

/*p {
  margin-left: 2em;
}*/

.menuBtn {
  background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI0IDI0IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IkhlYWRlciI+CiAgICA8Zz4KICAgICAgICA8cmVjdCB4PSItNjE4IiB5PSItMjIzMiIgZmlsbD0ibm9uZSIgd2lkdGg9IjE0MDAiIGhlaWdodD0iMzYwMCIvPgogICAgPC9nPgo8L2c+CjxnIGlkPSJMYWJlbCI+CjwvZz4KPGcgaWQ9Ikljb24iPgogICAgPGc+CiAgICAgICAgPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CiAgICAgICAgPHBhdGggZD0iTTMsMThoMTh2LTJIM1YxOHogTTMsMTNoMTh2LTJIM1YxM3ogTTMsNnYyaDE4VjZIM3oiIHN0eWxlPSJmaWxsOiNmM2YzZjM7Ii8+CiAgICA8L2c+CjwvZz4KPGcgaWQ9IkdyaWQiIGRpc3BsYXk9Im5vbmUiPgogICAgPGcgZGlzcGxheT0iaW5saW5lIj4KICAgIDwvZz4KPC9nPgo8L3N2Zz4=) no-repeat  center center;
}

.wellcome-page{
  background: url(../images/wellcome.jpg);
  width: 100%;
  height: 100%;
}

body.noscroll
{
  position: fixed; 
  overflow-y: scroll;
  width: 100%;
}

.wellcome-float{
  position: fixed;
  width:40%;
  height:400px;
  margin: auto;
  margin-top: 15%;
  left: 0;
  right: 0;
  background-color: rgba(225, 225, 225, 0.5);
  padding: 15px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 10px 10px 66px 0px rgba(0,0,0,0.84);
  -moz-box-shadow: 10px 10px 66px 0px rgba(0,0,0,0.84);
  box-shadow: 10px 10px 66px 0px rgba(0,0,0,0.84);
}

.avatar {
  margin-top: 1em;
  margin-right: 1em;
  position: center;
  -webkit-border-radius: 30%;
  -moz-border-radius: 30%;
  border-radius: 30%;
}

.avatar img {
  border-radius: 40px;
  position:center;
  width: 80px;
  height: 80px;
  margin: 6px;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
  box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
}

.md-toolbar-tools h1 {
  font-size: inherit;
  font-weight: inherit;
  margin: inherit;
}

.campusAvatar img
{
  border-radius: 40px;
  position:center;
  width: 80px;
  height: 80px;
  margin: 6px; 
  -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
  box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
}

.spacer{
  margin-right: auto;
  margin-left: auto;
}

.port_spacer
{
  margin-top: auto;
  margin-bottom: auto;
}

.center_all{
  margin:auto;
}

.mail_suffix
{
  margin-top: auto;
}


.createCampus
{
  position:relative;
}

.listdemoBasicUsage md-divider
{
  margin-top: 10px;
  margin-bottom: 10px;
}

.feed
{
  overflow-y: scroll;
  height: 350px;
  /*width: 100%;*/
}

.campusCard:hover, .campusCard:focus, .campusCard:active {
  -webkit-transform: rotate(4deg);
  transform: rotate(4deg);
}

/*.feedMessages
{
  overflow: scroll;
  height: 300px;
  width: 100%;
}
.feedTasks
{
  overflow: scroll;
  height: 300px;
  width: 100%;
}

.feedContent
{
  padding-left: 6%;
  font-size: 15px;
  display:table;
}*/

.md-no-sticky
{
  background-color: blue;
}

.roundUserAvatar
{
  width: 6%;
  height: auto;
  border-radius: 150px;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
  box-shadow: 0 0 8px rgba(0, 0, 0, .8);
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
  -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
}

.allCampusesShow
{
  overflow:hidden;
  background-size: auto;
  
}

.gray-font-no-animation
{
  color: #7f7f7f;
  font-size: 300%;
  text-shadow:#e0e0e0 1px 1px 0;
  
}

.gray-font
{
  color: #7f7f7f;
  font-size: 300%;
  text-shadow:#e0e0e0 1px 1px 0;
  opacity: 0;
  -webkit-animation-duration: 8s; 
  animation-duration: 8s; 
  -webkit-animation-fill-mode: both; 
  animation-fill-mode: both; 
  overflow: hidden;
  height: 100%;
} 

@-webkit-keyframes fadeOutUp { 
  0% { 
    opacity: 1; 
    -webkit-transform: translateY(0); 
  } 
  100% { 
    opacity: 0; 
    -webkit-transform: translateY(-200px); 
    /*-webkit-transform: scale(0,0); */
    height: 0px;
  } 
} 
@keyframes fadeOutUp { 
  0% { 
    opacity: 1; 
    transform: translateY(0); 
  } 
  100% { 
    opacity: 0; 
    transform: translateY(-200px); 
    /*transform: scale(0,0); */
    height: 0px;
  } 
} 
.fadeOutUp { 
  -webkit-animation-name: fadeOutUp; 
  animation-name: fadeOutUp; 
}

.user-pane-menu{
  width: 100%;
  height: 15%;
  background-color: #3F51B5;
  -webkit-box-shadow: 0px 13px 34px -14px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 13px 34px -14px rgba(0,0,0,0.75);
  box-shadow: 0px 13px 34px -14px rgba(0,0,0,0.75);
  top: 20px;
  position: relative;
}

.user-pane-menu img{
  border: 7px rgb(255, 255, 255) solid;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 50px;
  width: 30%;
  position: relative;
  z-index: 50;
}

.se-menu{
  /*margin-top: 20%;  */
}

.se-menu ul{
  list-style: none;
  padding: 0;
  padding-left: 0;
}

.se-menu li{
  width: 100%;
  padding: 15px 0px 15px 15px;
  font-size: 150%;
}

.se-menu li:hover{
  background-color: #E2E2E2;
  font-weight: bold;
  cursor: pointer;
}

.hoverable{
  cursor: pointer;
}

.hoverable:hover{
  cursor: pointer;
  background-color: #E2E2E2;
}


.se-menu li:active{
  background-color: #B2B2B2;
  text-shadow:#e0e0e0 1px 1px 0;
  font-weight: bold;
}

.se-menu .selected{
  background-color: #E2E2E2;
  text-shadow:#e0e0e0 1px 1px 0;
  font-weight: bold;
}

.user-box{
  width: 100%
}

.user-box img{
  width: 100%;
  border: 4px #7f7f7f solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.user-data{
  margin-top: auto;
}

.se-menu ul a{
  text-decoration: none !important;
  color: #7f7f7f;
}

/*Settings Style*/

.settingList .settingListItem:hover{
  background-color: #E2E2E2;
  font-weight: bold;
}

.settingList .settingListItemRoot{
  list-style: none;
  padding: 0;
  padding-left: 0;
}

.settingList .settingListItem{
  width: 100%;
  padding: 15px 0px auto 15px;
}


/*End Settings*/


/*md Effects*/

.md-avatar{
  width: 40px;
  height: 40px;
  margin-top: 8px;
  margin-bottom: 8px;
  margin-right: 16px;
  border-radius: 50%;
  box-sizing: content-box;
}


/* Colors*/
.gray{
  background:#f5f5f5;
}
.aliceblue {
  background: aliceblue; 
}
  .green {
  background: #b9f6ca;
}
  .yellow {
  background: #ffff8d;
}
  .blue {
  background: #84ffff;
}
  .purple {
  background: #b388ff;
}
  .red {
  background: #ff8a80;
}
/* End Colors */

.whiteframedemoBasicUsage md-whiteframe {
  background: #fff;
  margin: 20px;
  padding: 20px;
}

.projectExhibit
{
  padding-left: 4px;
  padding-right: 4px;
  margin: 5px;
  background-color: aliceblue;
  overflow: scroll;
  overflow-y: visible;
  height:250;
  width:300;
}
.projectDropDown
{
  border: 10px;
  border-color: solid red;
}

.cardAllCampuses
{
  word-break: break-word;
}

.addMessage
{
  font-size: 2em;
}
.tasksContent
{
  word-break: break-word;
}
.messagesContent .msgSent
{
  word-break: break-word;
  padding-top: 2em;
}

.tabDesign
{
  padding-left: 4px;
  padding-right: 4px;
  margin: 5px;
  /*background-color: #f5f5f5;*/
  overflow: scroll;
  height:500;
  /*width:690;*/
}

.tasksContent
{
  padding-left: 4px;
  padding-right: 4px;
  margin: 5px;
  background-color: aliceblue;
  overflow: scroll;
  overflow-y: visible;
  height:500;
  width:340;
}
.messagesContent
{
  padding-left: 4px;
  padding-right: 4px;
  margin: 5px;
  /*background-color: #f5f5f5;*/
  /*overflow: scroll;*/
  height:500;
  /*width:690;*/
}
p.tasksFeed
{
  padding-left: 4px;
  margin: 5px;
  width:99%;
  height: auto;
  background-color: aliceblue;
 
}
p.messagesFeed
{
  padding-left: 4px;
  margin: 5px;
  width:99%;
  height: auto;
  background-color: #f5f5f5;
}