body{
    margin:0;
    padding:0;
    font-family: Arial, sans-serif;
    background:#f4f4f4;
}

/* Header */
.mainTitle{
    background:#3d3d3d;
    text-align:center;
    padding:22px;
    border-bottom:1px solid #555;
}

.mainTitle .logo{
    color:#fff;
    font-size:20px;
    font-weight:bold;
    text-decoration:none;
}

/* Menu Grid */
.nav_links{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:#3d3d3d;
}

.nav_links a{
    color:#fff;
    text-decoration:none;
    text-align:center;
    padding:14px;
    border:1px solid #555;
    font-size:16px;
    transition:.3s;
}

.nav_links a:hover{
    background:#4c4c4c;
}

/* Search Area */
.search{
    background:#efefef;
    padding:20px;
}

.search form{
    display:flex;
    max-width:900px;
    margin:auto;
    gap:10px;
}

.form-control{
    flex:1;
    padding:12px 15px;
    border:1px solid #ddd;
    border-radius:3px;
    font-size:16px;
    outline:none;
}

.btn{
    background:#1565ff;
    color:#fff;
    border:none;
    padding:12px 35px;
    cursor:pointer;
    border-radius:3px;
    font-size:16px;
}

.btn:hover{
    background:#0047d4;
}

/* Mobile Responsive */
@media(max-width:768px){

.nav_links{
    grid-template-columns:repeat(2,1fr);
}

.search form{
    flex-direction:column;
}

.btn{
    width:100%;
}

}