html {
  position: relative;
  min-height: 100%;
}

body {
    background-color: #ffffff; 
    font-family: Oxygen, Helvetica, sans-serif;
      /* Margin bottom by footer height */
  margin-bottom: 28vh;
}     

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #f5f5f5;
  max-height: 28vh;
}

        .modal-open .modal {
    	outline: none;
    	z-index: 10002;
    	vertical-align: middle;
    	margin-top: 120px;
    }
    
       .modal-open .applyModal {
    	z-index: 10005;
    }
    
    .modal-footer .btn:hover {
    	border: 1px solid #dee2e1;
    	background-color: #0f5b44 !important;
    	color: #474747;
    }
    
    .modal-backdrop.fade.in {
    	opacity: 0.4;
    	filter: alpha(opacity=50);
    	z-index: 10001;
    }
    
    .apply-button {
    float:right;
    font-size: 105%; 

    }
    
    .description-button {
        float:right;
        margin: 0 10px 0 10px; 
        font-size: 105%; 
    }
    
    .close-button {
        background: #303c42 !important;
        color:#e0e5d7 !important;
    }
    
    .font-120 {
        font-size: 120%;
    }
    
    .fade-in-panel{ animation: fadeIn 2s; }

    @keyframes fadeIn {
      0% { opacity: 0; }
      100% { opacity: 1; }
    }


/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 484px) {
        .apply-button {
    font-size: 100%; 
    float: none;
    width: 100%;
    }
    
    .description-button {
    float: none;
    font-size: 100%; 
    width: 100%;
    margin: 10px 0px 10px 0px; 
    }
}