body h1, h2, h3, h4, h5, h6 {
    color: #0a72b8;
}

.nav-tabs{
    --bs-nav-tabs-border-width: none !important;
    --bs-nav-tabs-border-color: none !important;
}

.nav-link .active{
    --bs-nav-tabs-border-width: none !important;
    --bs-nav-tabs-border-color: none !important;
    font-weight: bold;
    color: #0A72B8 !important;    
}

/*.main-photo-one{
    background-color: #ffffffb3;        
    width: 100%;         
    position: relative;
    margin-top: -130px;
}*/

.header-container{
    //background-image: url('imgs/FotoMogan.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display:flex;
    align-items:end;
    height:100vh;
    width:100%;
}

.main-photo-two{
    background-color: #ffffffb3;        
    width: 100%;    
    margin-top: 110px;     
}

.img-fluid {
    width: 100%;
}

.contents {
    margin-left: 5%;
}

.contents p {
    font-size: 24px;
}

.join-course, .join-course-footer {
    background-color: #0a72b8;
}

.join-course, .join-course-footer {
    width: 25%;
    font-size: x-large;
}

.separator {
    width: 80%;
    color: #0a72b8;
    margin: auto;
}

.box-info {
    width: 250px;
    height: 230px;
    margin-bottom: 20px;        
    border: 2px solid #0A72B8;
}

.section {
    height: 300px;
    width: 100%;
}
/* .section-calendar {
    height: 400px;
    width: 100%;
} */

.mapsection {
    position: relative;    
}
.mapouter {
    position: absolute;
    top:35%; 
    left:30%;   
    width: 10%; 
}

.mapouter iframe {
    border-radius: 10%;
    border: 2px solid #0A72B8;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;    
}

.tab-content {
    padding: 10px;
    margin-left: 5%;
}


.nav-tabs {
    margin-left: 1.5%;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background-color:white;      
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active h4{
    font-weight: 800;
}

.requirement {    
    border: 2px solid #0A72B8;   
    border-radius: 30px;    
}

.footer-images {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;    
}  

.footer-images img {
    width: 20%;
}



.financed-by {
    color: #0A72B8;
    text-align: start;
    font-weight: 500;
}

.container-fluid{
    padding: 12px;
 }

@media (min-width: 576px) {
    .mapouter {
        position: absolute;
        top:12%;
        left:42%;        
    }   
    .mapouter iframe {
        width: 280px;
        height: 230px;
    } 
}

@media (min-width: 768px) {
    .mapouter {
        position: absolute;
        top:9%;
        left:42%;        
    }   
    .mapouter iframe {
        width: 390px;
        height: 320px;
    } 
}

@media (max-width: 768px){
    .header-container{
        height:75vh;
    }
}

@media (max-width: 576px){
    .header-container{
        height:50vh;
    }
}


@media (min-width: 992px) {
    .mapouter {
        position: absolute;
        top:8%;
        left:40%;        
    }  
    .mapouter iframe {
        width: 540px;
        height: 400px;
    } 
}



@media (min-width: 1200px) {
    .mapouter {
        position: absolute;
        top:12%;
        left:45%;        
    }   
    .mapouter iframe {
        width: 600px;
        height: 450px;
    }
    
}



@media (min-width: 1400px) {
    .mapouter {
        position: absolute;
        top:14%;
        left:52%;        
    }  
   
}

@media (min-width: 1600px) {
    .mapouter {
        position: absolute;
        top:14%;
        left:60%;        
    }     
}


@media (max-width: 576px) {
    .mapouter {
        position: relative;
        top:0%;
        left:5%;
        width: 10%;

    }
    .mapouter iframe {
        width: 400px;
        height: 280px;
    } 
    .section {
        height: 400px;
    }  
    /* .requirement {
        height: 400px;
    } */
    .footer-images {                
        flex-direction: column;                
        align-items: center;
    }  
    .footer-images img {
       width:70%;
       
    }
    .join-course, .join-course-footer {
        width: 70%;
    }
    .financed-by {        
        text-align: center;
    }
}