/* ===========================
GENERAL
=========================== */

body{

margin:0;

padding:0;

font-family:Arial,sans-serif;

background:#f7f8fc;

overflow-x:hidden;

color:#333;

padding-top:78px;

}

*{

box-sizing:border-box;

}

a{

text-decoration:none;

}

img{

max-width:100%;

display:block;

}

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

.custom-nav{

background:#004da8;

padding:8px 0;

box-shadow:0 2px 10px rgba(0,0,0,.15);

z-index:9999;

}

.navbar-brand h4{

font-size:24px;

font-weight:700;

margin:0;

}

.nav-link{

color:#fff !important;

font-weight:600;

margin-left:10px;

transition:.3s;

}

.nav-link:hover{

color:#ff9a00 !important;

}

.logo-mobile{

width:55px;

}

/* ===========================
SLIDER
=========================== */

.banner{

width:100%;

height:85vh;

min-height:520px;

object-fit:cover;

object-position:center center;

}

.banner{

margin-top:-78px;

padding-top:78px;

}

.carousel-item{

position:relative;

overflow:hidden;

}

.carousel-item::before{

content:"";

position:absolute;

left:0;

top:0;

width:100%;

height:100%;

background:rgba(0,0,0,.30);

z-index:1;

}

.carousel-caption{

position:absolute;

left:8%;

right:8%;

top:50%;

transform:translateY(-50%);

bottom:auto;

z-index:5;

text-align:left;

max-width:700px;

}

.carousel-caption h1{

font-size:58px;

font-weight:800;

line-height:1.1;

text-shadow:0 3px 10px rgba(0,0,0,.5);

margin-bottom:15px;

}

.carousel-caption p{

font-size:22px;

text-shadow:0 2px 6px rgba(0,0,0,.5);

margin-bottom:20px;

}

.carousel-control-prev,
.carousel-control-next{

z-index:10;

}

/* ===========================
BUTTONS
=========================== */

.btn-main{

background:#f57c00;

padding:12px 30px;

color:#fff;

border:none;

border-radius:8px;

font-weight:600;

display:inline-block;

transition:.3s;

}

.btn-main:hover{

background:#d66b00;

color:#fff;

}

/* ===========================
SECTION TITLES
=========================== */

.section-title{

font-size:42px;

font-weight:800;

color:#004da8;

margin-bottom:25px;

}

/* ===========================
FEATURE CARDS
=========================== */

.feature-card{

background:#fff;

padding:40px;

border-radius:20px;

box-shadow:0 5px 25px rgba(0,0,0,.08);

text-align:center;

height:100%;

transition:.3s;

}

.feature-card:hover{

transform:translateY(-8px);

}

.feature-card i{

font-size:45px;

margin-bottom:20px;

color:#f57c00;

}

.feature-card h4{

font-weight:700;

}

/* ===========================
COMMITTEE
=========================== */

.committee-card{

background:#fff;

border-radius:15px;

overflow:hidden;

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

height:100%;

transition:.3s;

}

.committee-card:hover{

transform:translateY(-5px);

}

.committee-card img{

width:100%;

height:240px;

object-fit:cover;

}

.committee-card .card-body{

padding:20px;

}

/* ===========================
TABLE
=========================== */

.table{

background:#fff;

}

.table th{

background:#004da8;

color:#fff;

}

.table-responsive{

overflow-x:auto;

}

/* ===========================
FORMS
=========================== */

form{

background:#fff;

padding:30px;

border-radius:20px;

box-shadow:0 5px 20px rgba(0,0,0,.06);

}

.form-control{

padding:12px;

border-radius:8px;

}

/* ===========================
UTILITY
=========================== */

.shadow-box{

padding:35px;

background:#fff;

border-radius:20px;

box-shadow:0 5px 25px rgba(0,0,0,.08);

}

.rounded-box{

border-radius:20px;

}

/* ===========================
FOOTER
=========================== */
.footer{

background:#003a7a;

color:#fff;

margin-top:70px;

padding-top:60px;

padding-bottom:0;

}

.footer h4{

font-weight:700;

margin-bottom:20px;

}

.footer ul{

padding:0;

list-style:none;

}

.footer ul li{

margin-bottom:10px;

}

.footer a{

color:white;

}

.footer a:hover{

color:#ff9a00;

}

.copyright{

background:#f57c00;

width:100%;

padding:14px;

margin-top:50px;

text-align:center;

font-weight:600;

color:white;

display:block;

}

/* ===========================
WHATSAPP
=========================== */

.whatsapp{

position:fixed;

right:20px;

bottom:20px;

width:60px;

height:60px;

background:#25d366;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

font-size:28px;

z-index:999;

box-shadow:0 5px 15px rgba(0,0,0,.25);

}
.navbar{

min-height:78px;

}


/* ===========================
TABLET
=========================== */

@media(max-width:991px){

.banner{

height:65vh;

min-height:420px;

}

.carousel-caption h1{

font-size:42px;

}

.section-title{

font-size:34px;

}

.navbar-nav{

padding-top:15px;

}

}


/* ===========================
MOBILE
=========================== */

@media(max-width:768px){

.logo-mobile{

width:42px;

}

.navbar-brand h4{

font-size:18px;

}

.banner{

height:320px;

min-height:auto;

}

.carousel-caption{

left:5%;

right:5%;

top:50%;

max-width:100%;

}

.carousel-caption h1{

font-size:28px;

}

.carousel-caption p{

font-size:15px;

}

.section-title{

font-size:28px;

}

.feature-card{

padding:25px;

margin-bottom:20px;

}

.committee-card img{

height:180px;

}

.footer{

text-align:center;

padding:40px 20px;

}

.footer .col-md-4{

margin-bottom:30px;

}

.btn-main{

padding:10px 20px;

font-size:14px;

}

form{

padding:20px;

}

.whatsapp{

width:55px;

height:55px;

font-size:24px;

}

}

/* ===========================
SMALL PHONES
=========================== */

@media(max-width:480px){

.banner{

height:260px;

}

.carousel-caption h1{

font-size:22px;

}

.carousel-caption p{

font-size:13px;

}

.section-title{

font-size:24px;

}

.feature-card{

padding:20px;

}

}
.main-logo{
background: #fff;
width:80px;

height:80px;

object-fit:contain;

border-radius:50%;

}
.association-name{

font-size:24px;

font-weight:800;

margin:0;

color:#ffffff;

line-height:1.1;

text-shadow:

0 2px 4px rgba(0,0,0,.5),

0 0 2px rgba(255,255,255,.3);

letter-spacing:.5px;

}
.association-sub{

color:#ffffff;

font-size:14px;

font-weight:500;

text-shadow:

0 2px 4px rgba(0,0,0,.5);

opacity:.95;

}

@media(max-width:768px){

.association-name{

font-size:16px;

}

.association-sub{

font-size:11px;

}

.main-logo{

width:55px;

height:55px;

}

}
.navbar-brand div{

padding:4px 10px;

border-radius:8px;

}


.navbar{

min-height:65px;

}

body{

padding-top:107px;

}

.banner{

margin-top:-65px;

padding-top:65px;

}
 


.inner-banner img{

width:100%;

height:100%;

object-fit:cover;

}
/* ===========================
INNER PAGE BANNER
=========================== */

.inner-banner{

position:relative;

width:100%;

height:350px;

overflow:hidden;

margin-bottom:40px;

display:block;

}

.inner-banner .banner{

width:100%;

height:350px;

object-fit:cover;

object-position:center;

display:block;

}

.inner-overlay{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

background:rgba(0,0,0,.45);

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

text-align:center;

color:#fff;

z-index:2;

padding:20px;

overflow:hidden;

}

.inner-overlay h1{

font-size:58px;

font-weight:800;

margin-bottom:10px;

}

.inner-overlay p{

font-size:20px;

margin:0;

}

/* Tablet */

@media(max-width:991px){

.inner-banner{

height:280px;

}

.inner-banner .banner{

height:280px;

}

.inner-overlay h1{

font-size:42px;

}

}

/* Mobile */

@media(max-width:768px){

.inner-banner{

height:220px;

margin-bottom:25px;

}

.inner-banner .banner{

height:220px;

}

.inner-overlay{

padding-top:142px;

}

.inner-overlay h1{

font-size:34px;

}

.inner-overlay p{

font-size:15px;

}

}

/* Small phones */

@media(max-width:480px){

.inner-banner{

height:190px;

}

.inner-banner .banner{

height:190px;

}

.inner-overlay h1{

font-size:28px;

}

}


.committee-card{

background:#fff;

border-radius:20px;

overflow:hidden;

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

transition:.3s;

height:100%;

}

.committee-card:hover{

transform:translateY(-8px);

}

.committee-card img{

width:100%;

height:260px;

object-fit:cover;

}

.committee-card .card-body{

padding:20px;

}

.committee-card h5{

font-weight:700;

margin-bottom:10px;

}

@media(max-width:768px){

.committee-card img{

height:180px;

}

}