*{
    margin: 0;
    padding:0;
}
.subtitle{
    font-size: 40px;
    text-shadow: 2px 2px 10px#ddd;
}
.img-logo{
    border-radius: 15px;
    height:150px;
}
.nav-link{
    margin-left:15px;
    margin-right: 15px;
}
.nav-link:hover{
    background-color:rgb(180, 179, 179);
    border-radius: 10px;
}
.top-header{
    background-color:#040447;

}
.contact{
    background-color:#00008B;
    color:white;
    padding-top:10px;
    padding-bottom: 10px;
    border-radius: 10px;
    font-weight: bold;
}

.container-fluid {
    width: 84% !important;
}
.carousel-item img{
            height:550px; 
            width:550px;
            object-fit:cover;
            margin:auto;
          }
/* ================================
   COMMON WEBSITE DARK THEME
   Apply on all pages
================================ */

:root {
    --theme-dark: #081b33;
    --theme-dark-2: #102f4a;
    --theme-blue: #19c8ff;
    --theme-text: #ffffff;
    --theme-muted: #d9e8f2;
}

/* Common dark section */
.common-dark,
.site-front,
.site-footer {
    background:
        linear-gradient(135deg, #071a30 0%, #0d2942 50%, #123d59 100%);
    color: var(--theme-text);
}

/* Front / Hero area */
.site-front {
    position: relative;
    overflow: hidden;
}

.site-front::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 75% 30%, rgba(25, 200, 255, 0.16), transparent 35%),
        radial-gradient(circle at 20% 80%, rgba(0, 120, 180, 0.12), transparent 40%);
    pointer-events: none;
}

.site-front > * {
    position: relative;
    z-index: 1;
}

/* Footer */
.site-footer {
    border-top: 1px solid rgba(255,255,255,0.12);
}

.site-footer h3,
.site-footer h4 {
    color: #ffffff;
}

.site-footer p,
.site-footer li,
.site-footer span {
    color: var(--theme-muted);
}

.site-footer a {
    color: #dcecf5;
    text-decoration: none;
    transition: 0.3s;
}

.site-footer a:hover {
    color: var(--theme-blue);
}

/* Common buttons */
.theme-btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 6px;
    background: #19c8ff;
    color: #061827 !important;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
}

.theme-btn:hover {
    background: #ffffff;
    color: #071a30 !important;
    transform: translateY(-2px);
}

/* Common headings */
.theme-heading {
    color: #ffffff;
}

.theme-heading span {
    color: #55d8ff;
}

/* Common cards */
.theme-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    padding: 25px;
    color: #ffffff;
    backdrop-filter: blur(8px);
    transition: 0.3s;
}

.theme-card:hover {
    transform: translateY(-5px);
    border-color: rgba(25,200,255,0.5);
    background: rgba(255,255,255,0.09);
}
/* =========================================
 /* =========================================
   COMMON FOOTER THEME - ALL PAGES
========================================= */

/* =========================================================
   TAYAL COMMON THEME
   ONLY TOP BAR + FOOTER
   DO NOT CHANGE MIDDLE / NAVIGATION / HERO
========================================================= */
/* =========================================================
   TAYAL - COMMON THEME
   APPLY ONLY TO:
   1. TOP BAR
   2. MAIN HERO
   3. FOOTER

   DO NOT CHANGE WHITE LOGO/NAVIGATION AREA
========================================================= */
/* =========================================================
   TAYAL COMMON DARK THEME
   ALL PAGES
   ONLY:
   - TOP BAR
   - HERO / FRONT SECTION
   - FOOTER
   - COPYRIGHT

   WHITE LOGO + MENU AREA = NO CHANGE
========================================================= */

:root {
    --tayal-dark-1: #071a30;
    --tayal-dark-2: #0d2942;
    --tayal-dark-3: #123d59;
}


/* =========================================================
   COMMON THEME BACKGROUND
========================================================= */

.top-header,
.hero,
.att-hero,
.footer-contact-section,
.copyright-section,
footer,
.footer,
.footer-section,
.footer-theme,
div.section[style*="background-color: #040447"] {

    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(25, 200, 255, 0.16),
            transparent 35%
        ),
        radial-gradient(
            circle at 20% 80%,
            rgba(0, 120, 180, 0.12),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            var(--tayal-dark-1) 0%,
            var(--tayal-dark-2) 50%,
            var(--tayal-dark-3) 100%
        ) !important;

    color: #ffffff !important;
}


/* =========================================================
   HERO CONTENT
========================================================= */

.hero,
.att-hero {
    color: #ffffff !important;
}


/* =========================================================
   TOP BAR TEXT
========================================================= */

.top-header,
.top-header a,
.top-header span,
.top-header i {
    color: #ffffff !important;
}


/* =========================================================
   FOOTER TEXT
========================================================= */

.footer-contact-section,
.footer-contact-section h1,
.footer-contact-section h2,
.footer-contact-section h3,
.footer-contact-section h4,
.footer-contact-section h5,
.footer-contact-section h6,
.footer-contact-section p,
.footer-contact-section li,
.footer-contact-section span,
.footer-contact-section a,

footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6,
footer p,
footer li,
footer span,
footer a {

    color: #ffffff !important;
}


/* =========================================================
   SOFTWARE / METAL / DOWNLOADS TYPE FOOTER
   Their footer is .section with #040447
========================================================= */

div.section[style*="background-color: #040447"] h1,
div.section[style*="background-color: #040447"] h2,
div.section[style*="background-color: #040447"] h3,
div.section[style*="background-color: #040447"] h4,
div.section[style*="background-color: #040447"] p,
div.section[style*="background-color: #040447"] li,
div.section[style*="background-color: #040447"] span,
div.section[style*="background-color: #040447"] a {
    color: #ffffff !important;
}


/* =========================================================
   FOOTER FORM
   WHITE BOXES REMAIN WHITE
========================================================= */

.footer-contact-section input,
.footer-contact-section textarea,
.footer-contact-section select,

div.section[style*="background-color: #040447"] input,
div.section[style*="background-color: #040447"] textarea,
div.section[style*="background-color: #040447"] select {

    background: #ffffff !important;
    color: #222222 !important;
}


/* =========================================================
   COPYRIGHT
========================================================= */

.copyright-section,
div.py-1[style*="background-color:black"] {

    background:
        linear-gradient(
            135deg,
            var(--tayal-dark-1) 0%,
            var(--tayal-dark-2) 50%,
            var(--tayal-dark-3) 100%
        ) !important;

    color: #ffffff !important;
}
/* =========================================================
   DOWNLOADS PAGE - SAME TAYAL DARK THEME
   ========================================================= */

.downloads-page {
    background: #ffffff;
}


/* Section heading bars */

.downloads-page .download-heading {
    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(25, 200, 255, 0.16),
            transparent 35%
        ),
        radial-gradient(
            circle at 20% 80%,
            rgba(0, 120, 180, 0.12),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            #071a30 0%,
            #0d2942 50%,
            #123d59 100%
        ) !important;

    color: #ffffff !important;
}


/* Heading text */

.downloads-page .download-heading h1 {
    color: #ffffff !important;
}


/* Download cards - WHITE HI RAHENGE */

.downloads-page .download-card {
    background: #ffffff !important;
    color: #071a30 !important;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(7, 26, 48, 0.08);
}


/* Card heading */

.downloads-page .download-card h4 {
    color: #071a30 !important;
}


/* Download link */

.downloads-page .download-card a {
    color: #087cff !important;
}


/* Hover */

.downloads-page .download-card:hover {
    border-color: #19c8ff;
    box-shadow: 0 12px 28px rgba(7, 26, 48, 0.14);
}
/* =========================================================
   COMMON STATS THEME
   Same theme as Hero / Navbar / Footer
========================================================= */

.stats {
    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(25, 200, 255, 0.16),
            transparent 35%
        ),
        radial-gradient(
            circle at 20% 80%,
            rgba(0, 120, 180, 0.12),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            #071a30 0%,
            #0d2942 50%,
            #123d59 100%
        ) !important;

    color: #ffffff !important;
}


/* Stats text */

.stats .stat {
    color: #ffffff !important;
}


/* Numbers */

.stats .stat strong {
    color: #ffffff !important;
}


/* Labels */

.stats .stat span {
    color: #d9e8f2 !important;
}


/* Icons */

.stats .stat i {
    color: #19c8ff !important;
}


/* Vertical separators */

.stats .stat + .stat {
    border-left-color: rgba(255,255,255,0.12) !important;
}