:root {

    --blue: #60cae6;
    --dark-blue: #15416d;
    --dark-blue2: #2166ab;
    
    --green: #85e200;
    --orange:#ff7f00;
    --yallow:#fedd00;
    --yallow2:#ccb100;
    --main-yallow:#ffd100;
    
  }


  .btn-primary{
    background-color : var(--dark-blue) !important;
    border-color: var(--dark-blue2) !important;
 }

 .bg-primary{
    background-color : var(--dark-blue) !important;
 }
 .nav-link{
    color: var(--yallow2) !important;
 }
.nav-link.active{
    color: var(--yallow) !important;
    font-weight: bold !important;
}
.btn-secondary2{
    background-color : var(--yallow) !important;
    border-color: var(--yallow2) !important;
 }

 .btn-outline-secondary2{

    border-color: var(--yallow2) !important;
    color: var(--yallow2) !important;
 }
 .btn-outline-secondary2:hover{
    color: #fff !important;
    background-color: var(--yallow2) !important;
    border-color: var(--yallow2) !important;
 }
 .text-secondary2{
    color: var(--yallow) !important;
 }
 .text-primary2{
    color: var(--dark-blue) !important;
 }
 .table-primary2{
    color : white !important;
    background-color: var(--dark-blue) !important;
    border-color: var(--dark-blue2) !important;
 }
 .bg-secondary2{
    background-color: var(--yallow) !important;
    border-color: var(--yallow2) !important;
 }
 .loading {
	z-index: 20;
	position: absolute;
	top: 0;
	left:-5px;
	width: 100%;
	height: 100%;
    background-color: rgba(0,0,0,0.4);
}
.loading-content {
	position: absolute;
	border: 16px solid var(--dark-blue); /* Light grey */
	border-top: 16px solid var(--yallow); /* Blue */
	border-radius: 50%;
	width: 50px;
	height: 50px;
	top: 40%;
	right:50%;
	animation: spin 2s linear infinite;
}
.text-bg-primary{
    background-color : var(--dark-blue) !important;
}
.text-bg-primary2{
    background-color : var(--blue) !important;
}
.text-bg-success{
    background-color : var(--green) !important;
}	
	@keyframes spin {
		0% { transform: rotate(0deg); }
		100% { transform: rotate(360deg); }
	}


   #background {
      background-position: center;
      background-size: cover;
      height: 100px;
      width: 100%;
    }
    
    @media (min-width: 480px) {
        #background { height: 350px; }
    }
    
    @media (min-width: 768px) {
        #background { height: 300px; }
    }
   
    @media (min-width: 992px) {
        #background { height: 460px; }
    }