/* Smooth Scroll */ html { scroll-behavior: smooth; } body { background-color: black; } :root { --white-color: #ffff; --primary-font: 'Montserrat', sans-serif; --secondary-font: 'Roboto', sans-serif; } /* custom scrollbar */ ::-webkit-scrollbar{ width: 10px; } ::-webkit-scrollbar-track{ background: black; } ::-webkit-scrollbar-thumb{ background: white; border-radius: 50px; } /* NavBar section */ .navbar-section { background-color: black; } .navbar-brand img { width: auto; height: 60px; } /* Home section */ .home-section { background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../assets/images//background-img.jpg); min-height: 100vh; background-size: cover; background-position: center; background-attachment: fixed; } .home-section h1 { margin: 0; font-weight: 900; font-size: 60px; color: var(--white-color); font-family: var(--primary-font); text-transform: uppercase; letter-spacing: 1px; padding-bottom: 10px; } .open-source{ color: red; } .home-section p { margin: 0; font-size: 20px; color: var(--white-color); font-family: var(--secondary-font); letter-spacing: 1px; } /* title */ .head-title{ color: var(--white-color); text-align: center; text-transform: uppercase; font-family: var(--white-color); font-size: 36px; padding-top: 60px; padding-bottom: 60px; font-weight: 900; } /* table */ thead{ color: red; font-size: 18px; font-family: var(--primary-font); } th{ color: red; font-size: 18px; font-family: var(--secondary-font); } td{ color: white; font-size: 18px; font-family: var(--secondary-font); } td a{ text-decoration: none; color: white; font-weight: 900; } td a:hover{ color: red; } /* footer */ .footer{ background-color: black; padding-top: 20px; padding-bottom: 20px; } .footer h6{ margin: 0; text-transform: uppercase; text-align: right; color: red; font-family: var(--white-color); font-size: 16px; font-weight: 600; } .inovus{ text-align: right; margin: 0; color: white; } .inovus a{ text-decoration: none; color: white; } .inovus a:hover{ color: red; } /* Custom Media Query */ /* small devices */ @media (max-width: 576px) { .home-section h1 { font-size: 36px; } .home-section p { font-size: 16px; } .head-title{ font-size: 24px; } } /* medium devices */ @media (max-width: 768px) { .home-section h1 { font-size: 36px; } .home-section p { font-size: 16px; } .head-title{ font-size: 24px; } } /* large devices */ @media (max-width: 992px) { } /* extra large devices */ @media (max-width: 1200px) { }