@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

#root{
    --primary:#244077;
    --secondary:#F7A50A;
}

*{
    font-family: 'Roboto', sans-serif !important;
    scroll-behavior: smooth !important;
}

body, html{
    width:100%;
    height:auto;
    margin:0;
    padding:0;
    box-sizing:border-box;
    scroll-behavior: smooth;
    background-color: #f5f5f5;
}

.login-band{
    display:none;
    /*width:100%;
    position:fixed;
    top:0;
    z-index: 100;
    height:auto;
    background-color:#244077;
    color:#fff;
    text-align:right;
    padding:5px 10px;
    font-size:14px;*/
}

nav.navbar{
    width:100%;
    height:auto;
    position:fixed;
    /*top:4.4rem;*/
    top:0;
    background-color:#fef9ef;
    z-index: 100;
    padding:1rem 0rem;
    box-shadow: 0px 0px 5px #d7d7d7;
}

nav.navbar-default .container{
    width:100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 2rem;
    display: flex !important;
    justify-content: right !important;
    align-items: center !important;
    color:#3f3f3f;
}

.navbar-brand {
    float: left;
    height: 80px;
    padding: 14.5px 0;
    font-size: 17px;
    line-height: 21px;
}

nav.navbar .container #navbar ul li a{
    font-size:1.6rem;
    font-weight: 400;
    color:#3f3f3f;
}

nav.navbar .container #navbar ul li.dropdown ul.dropdown-menu{
    background-color: white;
    padding-top:.5rem;
    padding-bottom:.5rem;
}

nav.navbar .container #navbar ul li.dropdown ul.dropdown-menu li a{
    color: #3d3d3d;
    font-weight: 600;
    padding-top:1.4rem;
    padding-bottom:1.4rem;
}

/*CAROUSEL SECTION HOME PAGE*/
section.band-1{
    width:100%;
    height:100vh;
}

section.band-1 .carousel-container .swiper-container{
    width:100%;
    height:100vh;
}

section.band-1 .carousel-container .swiper-container .swiper-wrapper::after{
    content:'';
    position: absolute;
    top: 0%;
    left: 0%;
    width:100%;
    height:100vh;
    z-index: 90;
    background-color: rgba(0, 0, 0, 0.5);
}

section.band-1 .carousel-container .swiper-container::before {
    content: "The Rotary Club Of";
    position: absolute;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 6rem;
    bottom: 34%;
    left: 6%;
    z-index: 95;
}

section.band-1 .carousel-container .swiper-container::after {
    content: "Kiwatule";
    position: absolute;
    color: #F7A50A; 
    font-weight: 900;
    font-size: 10rem;
    bottom:14%;
    left: 6%;
    z-index: 95;
}

section.band-1 .carousel-container .swiper-container img{
    width:100%;
    height:100vh;
    object-fit: cover;
    object-position: top;
}