body {
    font-family: 'Montserrat', Arial, sans-serif;
    background-color: #0071BC;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.login-container {
    max-width: 400px;
    margin: 60px auto;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(44,62,80,0.12);
    padding: 2.5rem 2rem 2rem 2rem;
    border: 1px solid #e3e8ee;
}

.login-container h2 {
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: #0B6AA1;
    letter-spacing: 1px;
    text-align: center;
}
.form-label {
    font-weight: 600;
    color: #0B6AA1;
}
.form-control {
    border-radius: 8px;
    border: 1px solid #d1d5db;
}
.form-control:focus {
    border-color: #0B6AA1;
    box-shadow: 0 0 0 0.2rem rgba(13,110,253,.10);
}
.btn-primary {
    width: 100%;
    font-weight: 700;
    border-radius: 8px;
    background: linear-gradient(90deg, #0B6AA1 60%, #0B6AA1 100%);
    border: none;
    transition: background 0.2s;
}
.btn-primary:hover {
    background: linear-gradient(90deg, #0B6AA1 60%, #0B6AA1 100%);
}
.courses-section {
    max-width: 1100px;
    margin: 40px auto 0 auto;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(44,62,80,0.10);
    padding: 2.5rem 2rem 2rem 2rem;
    border: 1px solid #e3e8ee;
}
.courses-section h2 {
    font-weight: 700;
    color: #0B6AA1;
    letter-spacing: 1px;
}
.course-card {
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(44,62,80,0.08);
    border: 1px solid #e3e8ee;
    transition: transform 0.15s, box-shadow 0.15s;
    background: #f9fafb;
}
.course-card:hover {
    transform: translateY(-6px) scale(1.025);
    box-shadow: 0 8px 32px rgba(44,62,80,0.15);
}
.course-card img {
    max-height: 130px;
    object-fit: contain;
    background: #f1f5f9;
    border-radius: 16px 16px 0 0;
    padding: 1.5rem 0.5rem 0.5rem 0.5rem;
}
.card-title {
    font-weight: 700;
    color: #0B6AA1;
}
.card-text {
    color: #475569;
    font-size: 0.98rem;
}
.btn-outline {
    border-color: #14446b00;
    background-color: #0B6AA1;
    color: white;
    border-radius: 20px;
    font-weight: 600;
    border-width: 2px;
    transition: background 0.2s, color 0.2s;
}

.btn-outline:hover {
    background: rgba(71, 151, 25, 0.925);
    color: #fff;
}

/* Footer */
.footer1 { 
    background: #ffffff; 
    padding: 35px 0 0 0; 
    font-size: 12px; 
    color: #0B6AA1; 
}

.footer1 a { 
    color: #0f4463; 
}

.footer1 a:hover {
    color: #0B6AA1; 
}

.footer1 .widget { 
    margin-bottom:30px; 
}		
	
.footer1 .widget-title { 
    font-size: 17px; 
    font-weight: bold; 
    color: #0B6AA1; 
    margin: 0 0 20px; 
}

.footer1 .entry-meta { 
    border-top: 1px solid #0f4463; 
    border-bottom: 1px solid #0f4463; 
    margin: 0 0 35px 0; 
    padding: 2px 0; 
    color: #0B6AA1; 
    font-size: 12px; 
    font-size: 0.75rem; 
}
		
.footer1 .entry-meta a { 
    color: #333333; 
}
		
.footer1 .entry-meta .meta-in { 
    border-top: 1px solid #0f4463; 
    border-bottom: 1px solid #0f4463; 
    padding: 10px 0; 
}
	
.follow-me-icons { 
    font-size:30px; 
}		
		
.follow-me-icons i { 
    float:left; 
    margin:0 10px 0 0; 
}		

.footer2 { 
    margin-top: -2%;
    background: #b0cbd3; 
    padding: 15px 0; 
    color: #103b53; 
    font-size: 12px; 
}
	
.footer2 a { 
    color: #103b53; 
}
		
.footer2 a:hover { 
    color: #0f4463; 
}
		
.footer2 p { 
    margin: 0; 
}

.widget-simplenav { 
    margin-left:-5px; 
}		
	
.widget-simplenav a{ 
    margin:0 5px; 
}	

.img-ftr{
    margin-top: -15%;
    width: 50%;
}

.follow-me-icons{
    margin-left: 5.6%;
}

#txtftr{
    margin-left: 5.6%;
}


#ftr-cont{
    border-left: 1px solid #fff;
    width: 20%;
    position: absolute;
    margin-left: 80%;
    margin-top: -0.1%;
}

.row{
    margin-inline-end: 5%;
}

@media only screen and (max-width:1000px) {
    #ftr-cont{
    border-left: 1px solid #fff;
    }

    #ctn-ftr2{
        margin-left: -4%;
    }

    .ftr-line{
        display: none;
    }
}

@media only screen and (max-width:772px) {
    #ftr-cont{
        width: 88%;
        position: relative;
        margin-left: 7%;
        margin-top: 1%;
        margin-bottom: 7%;
        border-bottom: 1px solid rgb(255, 255, 255);
        border-left: 1px solid #ffffff00;
    }

    #ctn-ftr2{
        margin-left: 7%;
        width: 88%;
    }

    .ftr-line{
        display: none;
    }
    }

#logoutBtn {
    border-radius: 8px;
    font-weight: 600;
    margin-top: 1rem;
    background: #e0e7ef;
    color: #0B6AA1;
    border: 2px solid #0B6AA1;
    transition: background 0.2s, color 0.2s;
}
#logoutBtn:hover {
    background: #0B6AA1;
    color: #fff;
}
@media (max-width: 991px) {
    .courses-section {
        padding: 1.5rem 0.5rem;
    }
    .row.g-4 {
        row-gap: 2rem;
    }
}
@media (max-width: 767px) {
    .courses-section {
        max-width: 98vw;
    }
    .login-container {
        max-width: 98vw;
    }
}