@font-face {
  font-family: "HelloHeartache";
  src: url("../fonts/HelloHeartache.eot");
  src: 
  url("../fonts/HelloHeartache.woff") format("woff"),
  url("../fonts/HelloHeartache.otf") format("opentype"),
  url("../fonts/HelloHeartache.svg#filename") format("svg");
}


.w3-teal, .w3-hover-teal:hover {
  color: #fff!important;
  background-color: #333333!important;
}

#topBar{
position: fixed; 
width:100%; 
z-index:5;
}

.w3-bar-item:hover{
  background-color:#B7223D !important;
  color:white!important;
}

#closeButton{
 background-color:#B7223D !important;
  color:white!important;
}

.w3-main{
  margin-left: 170px!important;
}
@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}}
.w3-animate-left {
  position: relative;
  animation: animateleft 0.4s;
}
.w3-red {
   background-color:#B7223D !important;
}

.w3-sidebar {
  height: 100%;
      width: 170px!important;
  background-color:  #333333;
  position: fixed!important;
  z-index: 10;
  overflow: auto;
  color:white;
}

.w3-container h1{
  font-family: 'HelloHeartache';
  font-weight:normal;
  font-style:normal;

}


#imgLogo{
  padding: 5px 5px;
  background-color:white
}

#logoDiv{
  display:table;
      margin-left: 0px;
    height: 80px;
    margin-top: 0px;
    background-color: white;
    padding-left: 10px;
    padding-right: 10px;
}

.navbar{
      color: white;
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.navbar-brand{
      display: table-cell;
    vertical-align: middle;
}