/*=====================================
GOOGLE FONT
======================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Poppins',sans-serif;

    color:#444;

    background:#ffffff;

    line-height:1.8;

}

/*=====================================
COLORS
======================================*/

:root{

    --primary:#003B7A;

    --secondary:#FDB913;

    --light:#f5f7fa;

    --dark:#222;

}

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

.topbar{

    background:var(--primary);

    color:#fff;

    padding:10px 0;

    font-size:14px;

}

/*=====================================
NAVBAR
======================================*/

.navbar{

    transition:.4s;

    background:#fff;

}

.navbar-brand img{

    transition:.3s;

}

.nav-link{

    color:#333 !important;

    font-weight:600;

    margin-left:20px;

}

.nav-link:hover{

    color:var(--secondary)!important;

}

.btn-warning{

    background:var(--secondary);

    border:none;

    color:#222;

    font-weight:700;

    transition:.4s;

}

.btn-warning:hover{

    transform:translateY(-3px);

    box-shadow:0 12px 30px rgba(0,0,0,.2);

}

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

.hero{

    background:

    linear-gradient(rgba(0,45,98,.85),

    rgba(0,45,98,.85)),

    url("../images/hero.jpg");

    background-size:cover;

    background-position:center;

    min-height:95vh;

    display:flex;

    align-items:center;

}

.hero h1{

    font-size:60px;

    line-height:1.2;

    font-weight:800;

}

.hero p{

    font-size:20px;

}

.hero-image{

    animation:float 5s ease-in-out infinite;

}

@keyframes float{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-18px);

}

100%{

transform:translateY(0);

}

}

/*=====================================
STATISTICS
======================================*/

.stats{

    background:#fff;

    padding:70px 0;

}

.stat-box{

    text-align:center;

    background:#fff;

    padding:40px;

    border-radius:15px;

    box-shadow:0 20px 40px rgba(0,0,0,.08);

    transition:.4s;

}

.stat-box:hover{

transform:translateY(-10px);

}

.stat-box h2{

font-size:50px;

font-weight:800;

color:var(--primary);

}

.stat-box p{

font-weight:600;

margin-top:10px;

}

/*=====================================
ABOUT
======================================*/

#about{

padding:100px 0;

}

#about img{

border-radius:20px;

box-shadow:0 20px 50px rgba(0,0,0,.15);

}

#about h2{

font-size:42px;

font-weight:800;

color:var(--primary);

}

#about p{

font-size:17px;

}

/*=====================================
SECTION TITLE
======================================*/

section h2{

font-size:42px;

font-weight:800;

color:var(--primary);

margin-bottom:20px;

}

section{

padding:100px 0;

}