@font-face {
    font-family: 'angelina';
    src: url('../fonts/angelina.ttf');
}
@font-face {
    font-family: 'obux';
    src: url('../fonts/obux.ttf');
}
@font-face {
    font-family: 'eraslight';
    src: url('../fonts/eraslight.ttf');
}
@font-face {
    font-family: 'font1'; /*a name to be used later*/
    src: url('../fonts/RT.ttf'); /*URL to font*/
}

html, body{
background-color:#f3f3f4;
color:#676a6c;  
height:100%;
margin:0!important;
padding:0!important;
}

.nbd{
	background:rgba(7, 153, 146,0.8);
  border-bottom:1px solid #eeeeee;

}

.main{
 margin-top:50px;
 margin-bottom:50px;
}

.nb{
  color:#ffffff!important;
  font-size:1.5em;
}

.nbr > li > a{
  color:#f1f1f1 !important;
}

.active a{
  background:#1abc9c!important;
  color:black!important;
  font-weight:bold;
}

footer{
  background:#2f3542;
  color:white;
  height:40px;
  text-align:center;
  line-height:40px;
  left: 0;
  bottom: 0;
  width: 100%;
  position:fixed;
  
}
#mast{
  padding:20px;
  }
 
.mybtn{
  width:100%;
  padding:10px;
  outline:none;
  border:none;
  background:#fa8231;
  font-family:arial;
  font-size:1.2em;
  color:white;
}

.mybtn:hover{
 background:#fd9644;
}

.register{
  color:#fa8231;
  font-family:angelina;
  font-weight:bold; 
  
}
hr.line{
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

.active{
 color:red;
  
}
/*Start of Admin Dashboard*/

#side-menu{
  background-color: #dfe6e9;
  padding:0px;
  }

#side-menu .header-title{
 color:#1f3647;
 text-align:center;
 font-size:25px;
 background:#485460;
 font-family:obux;
 color:white;
 padding:5px;
 border-bottom:#1e272e;
 
}

#side-menu a{
 padding:12px 20px;
 text-decoration:none;
 color:#000000;
 /*font-weight:bold;*/
 font-size:13px;
 display:block;
 }
 
 #side-menu a:hover{
 background:#00d2d3;
 color:white;
 display:block;
 }
 
 #side-menu ul{
  list-style:none;
  margin:0px;
  padding:0px;
 }
 
 #side-menu .glyphicon{
   margin-right:6px;
 }

  #side-menu .active a{
 color:white;
 background:#00d2d3;
 }
 
#side-menu .collapseable a{
color:#c8d6e5;
font-size:12px;
text-decoration:none;
display:block;
padding:0px 10px;

 }

 #side-menu .collapseable a:hover{
color:white;
background:#576574;
}

#side-menu .collapseable{
background:#576574;
border-left:4px solid #00b894;
}

 #side-menu .collapseable li {
padding-left:20px;
padding-top:5px;
border-bottom:1px solid #8395a7;
 }

 #side-menu .link > ul > li{
padding-bottom:10px;
}
 
.display-table{
  display:table;
  padding:0!important;
  width:100%;
  height:100%;
  margin:0;
  }

.display-table-row{
  display:table-row;
  height:100%;
   }

.display-table-cell{
  display:table-cell;
  float:none;
  height:100%;
 
}

form div{
  margin-bottom:15px;
}

.valign-top{
  vertical-align:top;
}

#nav-header{
  background:#ffffff;
  border-bottom:1px solid #e7eaec;
  width:100%;
  padding:15px 20px;
}


#admin-footer{
  position:absolute;
  width:100%;
  bottom:0px;
  font-size:12px;
  padding:10px;
  background:white;
  border-top:1px solid #dfe6e9;
  font-size:0.9em;
  color:#222f3e;
  }
 
 
 /*********
 End of Admin Dashboard*****/

 /****
  Start of Login Page
  
 ****/
 
 .login-wrapper{
   max-width:500px;
   padding:20px;
   background:white;
   margin:100px auto;
   font-family:obux; 
   box-shadow: 0px 15px 10px -15px rgba(46,139,87 ,1 )
   
 }
 
 #login-header{
   background:#485460;
   color:white;
   text-align:center;
   margin-bottom:15px;
   height:50px;
   line-height:50px;
   font-family:obux;
   font-size:1.5em;
   text-shadow:1px 1px black;
 }
 
#login-body div{
  margin-bottom:15px;
  font-size:1.2em;
  
} 

.fc{
  width:100%;
  padding:10px;
  border:none;
  border-bottom:1px solid #485460;
 }

.fc:focus{
  box-shadow: 0px 15px 10px -15px rgba(46,139,87 ,1 );
  border-bottom: 1px solid rgba(46,139,87 ,1 );
 }

.form-submit{
  width:100%;
  padding:10px 0;
  background:#ffb142;
  border:none;
  outline:none;
  font-family:arial;
  font-size:1.2em;
  color:white;
}

.form-submit:hover{
background:#cc8e35;
}

#login-footer span{
  margin-bottom:10px;
  font-family:arial;
  color:#1e272e;
  font-size:0.85em;
}

.stage{
  padding:10px!important;
 }
 
 #stage-content{
   background:white;
   padding:10px;
   font-family:obux;
   margin-bottom:100px;
 }
 .heading{
   font-family:arial;
   font-weight:bold;
   color:#000000;
 }
 .journal{
   color:#000000;
   text-align:justify;
 }
 
#foundation{
   background:rgba(255, 255, 255, 0.6)!important;
   margin-top:50px;
   padding:20px;
 }
 
.track{
   background:#218c74!important;
   color:white!important;
   height:50px;
   line-height:50px;
   margin-bottom:10px;
   text-align:center;
   font-size:1.0em;
   }

.track:hover{
   background:#1abc9c;
   }

.track > a{
  color:white;
  font-family:obux;
  display:block;
  text-decoration:none;  
}

.short{
  display:none;
}

@media only screen and (max-width: 450px) {
    .track{
        font-size:1.2em;
    }
    
    .short{
      display:inline-block!important;
    }
    
    .full{
      display:none!important;
    }
    
    #foundation{
      margin-top:20px;
    }
    
   
}