@font-face {
  font-family: "Cerebri Sans";
  src: url(../fonts/Cerebri-Sans/CerebriSans-Light.eot);
  src: url(../fonts/Cerebri-Sans/CerebriSans-Light.ttf);
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Cerebri Sans";
  src: url(../fonts/Cerebri-Sans/CerebriSans-Regular.eot);
  src: url(../fonts/Cerebri-Sans/CerebriSans-Regular.ttf);
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Cerebri Sans";
  src: url(../fonts/Cerebri-Sans/CerebriSans-Bold.eot);
  src: url(../fonts/Cerebri-Sans/CerebriSans-Bold.ttf);
  font-weight: 700;
  font-style: normal;
}



ul.tabs li {
    position: relative;
    text-decoration: none;
    transition: all 0.2s;
    width: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    color: rgba(255, 255, 255, 0.7);
    border-radius: 5px;
    /*padding: 5px;*/
    /*padding: 2px;*/
    /*padding: 15px;*/
    padding: 10px;
    padding-top: 17px;
    padding-bottom: 17px;
    font-family: "Cerebri Sans";
    font-size: 0.9em;
    font-size: 16px;
    letter-spacing: 0.2px;
    text-align: left;
    /*margin-top:4px;*/
    margin-top:2px;
    cursor: pointer;
    /*display: block;*/
}



ul.tabs li.main {
    color: #c8c7d5;
}

ul.tabs li:hover {
  background: #350596;
  color: #fff;
}

ul.tabs li.active {
  color: #fff;
}

#nav {
   
    border-bottom: 2px solid rgba(255, 255, 255, 0.20);
}
.tabs-menu-container {
    border-right: 2px solid rgba(255, 255, 255, 0.20);
}

.menu-icon {
  /*display: block;*/
  /*width: 100%;*/
  text-align: center;
  min-width: 30%;
}

.menu-text {
  /*display: block;*/
  /*width: 100%;*/
  text-align: center;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  /*width: 70%;*/
  /*padding-left: 10px;*/
}

.smr-main-section {
  /*background: #1a1450;*/
}

.component-title h1 {
  /*color: #fff;*/
  text-align: left;
}

.dashboard-elements-container{
  width: 92%;
  margin: 0 auto;
  display: flex;
  /*align-items:center;*/
}

.dashboard-component {
  background:#fff;padding:12px;border-radius:12px;margin:0 auto;
  padding-top:0px;
  margin-top: 25px;
  box-shadow:0 2px 4px rgba(50,50,93,.1);
  width:33%;
  /*display: inline-block;*/
  margin-left: 10px;
  margin-right: 10px;
  cursor: pointer;
  text-align: center;
  vertical-align: top;
  /*justify-content: space-evenly; */
  justify-content: center; 
}

.dashboard-component:hover {
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
    -webkit-box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
    box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
}

.dashboard-contents-medium {
    padding: 15px;
    padding-top: 25px;
    padding-bottom: 10px;
}

.dashboard-contents-medium h1 {
  
    font-weight: 700;
    font-family: "Cerebri Sans", sans-serif;
    font-size: 0.8em;
    letter-spacing: 0.2px;
    padding-bottom: 12px;
    text-transform: uppercase;

}

.dashboard-contents-medium h2 {
  
    font-weight: 300;
    font-family: "Cerebri Sans", sans-serif;
    font-size: 0.8em;
    line-height: 2;
    color: #888;
    padding-top: 8px;
    /*letter-spacing: 0.2px;*/
    /*padding-bottom: 12px;*/
    /*text-transform: uppercase;*/

}




@media (max-width: 1100px) {

.dashboard-component {
  width: 100%;
  display: block;
}

.dashboard-elements-container {
  display: block;
}


}




.subcomponent-title h1 {
      text-transform: uppercase;
    font-size: 18px;
    padding-top: 12px;
    font-weight: 600;
    /*color: #52575c;*/
}

.subcomponent-title h2 {
  font-size: 18px;
  line-height: 1.6;
}