@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@300..900&display=swap');

*{margin: 0; padding: 0;}

html{scroll-behavior: smooth;}

body{ font-family: "Inter", serif; }

.forTabScreen{display: none;}
.forMobile{display: none;}

:root{
    --mainBlue: #172135;
    --mainPink: #FF5A65;
}

h1{ 
    font-size: 4vw; 
    font-weight: 400;
    font-family: "Fira Sans", serif; 
}

h2{ 
    font-size: 3.5vw; 
    font-weight: 400;
    font-family: "Fira Sans", serif; 
}

h3{ 
    font-size: 2.7vw; 
    font-weight: 400;
    font-family: "Fira Sans", serif; 
}


h4{ 
    font-size: 2.3vw; 
    font-weight: 400;
    font-family: "Fira Sans", serif; 
}

/* h5{
    font-size: 1.8vw; 
    font-weight: 400;
    font-family: "Fira Sans", serif; 
} */

h6{
    font-size: 1.5vw;
    font-weight: 450;
    font-family: "Poppins", sans-serif;         
}

p{ font-size: 1.3vw; color: #4a4a52;}

a{
    display: inline-block;    
    text-decoration: none;
    color: black;    
    font-family: "Poppins", sans-serif;    
    font-size: 1.3vw;    
    text-transform: uppercase;
}

.button{    
    color: white;
    font-size: 1.2vw;
    font-weight: 450;          
    background-color: var(--mainPink);
    padding: 1.5vh 1.8vw;
    border-radius: 50px;
    border: 1px solid var(--mainPink) ;
    transition: 0.3s all;
    cursor: pointer;    
}

.button:hover{ background-color: transparent; color: var(--mainPink);}

/*===================== Google Translator Style =====================*/

body{ top: 0px !important; }

#google_translate_element img{ display: none !important; }

#google_translate_element{ margin-right: 2vw;}

body > .skiptranslate > iframe.skiptranslate {
    display: none !important;
      visibility: hidden !important;
}

#goog-gt-tt, .goog-te-balloon-frame,div#goog-gt-{display: none !important;}

.VIpgJd-ZVi9od-l4eHX-hSRGPd{ display: none !important; }

.goog-logo-link{ display: none !important;}

.goog-text-highlight { background: none !important; box-shadow: none !important; }

.goog-te-gadget { font-size: 0px !important; }

#google_translate_element select{
    background-color: #f0e5e5 !important;
    border: 1.5px solid #103142  !important;
    font-size:  1vw !important;    
    padding: 0.2vw !important;      
    font-family: "Poppins", sans-serif;    
}

#google_translate_element select option{
    background-color: #f0e5e5 !important;  
    font-size:  1vw !important;
    font-weight: 450;    
}


/*===================== Contact Us Button =====================*/
.contactUsButton{
    font-family: "Darker Grotesque", sans-serif;
    position: fixed;    
    width: 12vw;
    height: 12vw;        
    z-index: 999;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    right: 3vw;
    bottom: 3vh;    
    /* opacity: 0;     */    
}

.circularText{    
    font-weight: 600;
    position: absolute;
    height: 100%;
    width: 100%;        
    font-size: 1.2vw;
    animation: circularTextAnimation 10s linear infinite;       
}

@keyframes circularTextAnimation {
    0%{transform: rotate(0deg);}    
    100%{transform: rotate(360deg);}    
}

.circularText span{
    position: absolute;
    left: 50%;
    top: 9%;
    transform-origin:0 5vw;
}

.contactUsButton i{
    font-size: 3vw;
    color: rgba(255, 255, 255, 0.85);
    background-color: #FF5A65;
    padding: 1.5vw;
    border-radius: 50%;
    transition: 0.3s ease;    
}

.contactUsButton:hover i{ color: white; }


/*===================== Banner =====================*/
.banner{
    height: 60vh;
    width: 98%;
    position: relative;
    display: flex;    
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url(../media_files/bannerAboutUs.jpg) center fixed;    
    background-size: cover;  
    border-radius: 25px;
    margin-inline: 1%;        
    gap: 3vh;
    text-align: center;
    user-select: none;
}

.bannerAward{background-image: url(../media_files/bannerAward.jpg);}

.bannerForm{background-image: url(../media_files/bannerForm.jpg);}

.bannerMission{background-image: url(../media_files/bannerMission.jpg);}

.bannerPlan{background-image: url(../media_files/bannerPlan.jpg);}

.bannerGallery{background-image: url(../media_files/bannerGallery.jpg);}

.bannerContactUs{background-image: url(../media_files/bannerContactUs.jpg);}

.banner::before{
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #033F63; 
    opacity: 0.5;
    border-radius: 25px;
}

.banner h1{ font-weight: 450; color: white; z-index: 7; }

.banner p{ z-index: 7; font-size: 1.5vw; margin-top: -5vh; }

.scrollIcon{    
    padding: 1.2vw 1.5vw;    
    border-radius: 50%;
    border: 2px solid white; 
    transition: 0.3s ease; 
    overflow: hidden;    
    color: white;
    transition: 0.3s ease;
    z-index: 1;
    position: absolute;
    bottom: 5vh;
    user-select: none;
}

.scrollIcon i{    
    font-size: 1.7vw;   
    animation: scrollArrow 2s infinite;         
}

@keyframes scrollArrow {
    0%{transform: translateY(-200%);}
    20%{transform: translateY(0%);}
    80%{transform: translateY(0%);}
    100%{transform: translateY(200%);}    
}

/*====================== Header ======================*/
header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--mainBlue);
    color: white;
    padding: 1vh;
}

header a{color: white; font-size: 1vw;}

header a:hover{color: var(--mainPink);}

.headerContactMain{display: flex; margin-left: 2vw;}

.headerContact{margin-left: 2vw;}

.headerSocial i{font-size: 1.5vw; margin-right: 2vw; transition: 0.s ease;}
.headerSocial i:hover{transform:scale(1.2);}

/*====================== NavBar ======================*/
#toggleCheck, #toggleBtn{ display: none; }

nav{ 
    display: flex;
    align-items: center;
    justify-content: space-between;            
    background-color: white;
    padding: 1vh 0;         
}

nav ul{ list-style: none; margin-right: 3vw;}

.logo img{ width: 15vw;  margin-left: 3vw;}

nav ul li{
    position: relative;
    float: left;        
    margin-left: 3vw;    
    margin-top: 1.5vh;
}

nav ul li a{    
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;    
    overflow: hidden;   
    user-select: none; 
}

.buttonLi{margin-top: 0;}

nav .button{margin-left: 7vw;}

nav ul li a span{transition: transform 0.3s ease-in-out;}

nav ul li a span:nth-child(2){position: absolute; top: 100%;}

nav ul li a:hover span{transform: translateY(-100%);}

.dropNavBar{
    position: absolute;    
    text-wrap: nowrap;
    left: 50%;
    transform: translate(-50%);         
    display: none;        
    z-index: 999;    
}

.dropNavBar li:first-child{ height: 3vh; padding: 0; background-color: transparent; border: transparent; }

.dropNavBar li:nth-child(2){
    padding-top: 4vh; 
    border-top: solid 1px rgba(128, 128, 128, 0.3);
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.dropNavBar li:last-child{
    padding-bottom: 4vh; 
    border-bottom: solid 1px rgba(128, 128, 128, 0.3);
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.dropNavBar li{ 
    margin-left: 0; 
    width: 30vw; 
    padding: 2vh 0; 
    margin: 0; 
    background-color: white;
    border-left: solid 1px rgba(128, 128, 128, 0.3);
    border-right: solid 1px rgba(128, 128, 128, 0.3);    
}

.dropNavTop:hover > .dropNavBar, .dropNavTop:focus-within > .dropNavBar{display: initial;}

.dropNavBar li a{font-size: 1.2vw;}

.dropNavTop{user-select: none;}

/*====================== Hero Section ======================*/
#hero{   
    width: 100%;
    background-color: #f0e5e5;
    animation: bgChange 9s infinite;    
}

@keyframes bgChange {
    0%{background-color: #f1f0fd;}    
    50%{background-color: #e6f5f0;}
    100%{background-color: #f8f5f2;}    
}

.heroSection{
    height: 90vh;
    width: 100%;
    display: flex;    
    align-items: center;        
}

.heroLeftText{
    display: flex;    
    align-items: center;
    height: 90%;
    width: 50%;
    background-color: white;
    border-top-right-radius: 600px; 
    border-bottom-right-radius: 600px;    
}

.heroLeftTextBox{
    display: flex;
    flex-direction: column;
    margin-left: 7vw;   
    gap: 4.5vh;
}

.heroLeftText h1,.heroLeftText p{width: 80%;}


.heroRightPhoto{
    height: 80%;
    width: 40%;    
    margin-left: 5%;
    border-radius: 100px;
    background-image: url(/media_files/images/slideImage_0001.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    animation: bgImageChange 9s infinite;    
}

@keyframes bgImageChange {
    0%{background-image: url(/media_files/images/slideImage_0001.png);}        
    35%{background-image: url(/media_files/images/slideImage_0001.png);}        
    45%{background-image: url(/media_files/images/slideImage_0002.png);}        
    70%{background-image: url(/media_files/images/slideImage_0002.png);}        
    75%{background-image: url(/media_files/images/slideImage_0003.png);}        
    90%{background-image: url(/media_files/images/slideImage_0003.png);}
}

/*====================== Hero About Us Section ======================*/
.heroAboutUs{            
    display: flex;  
    justify-content: space-evenly;
    align-items: center;
    padding: 5vh 0;  
}

.heroAboutUsPhoto{
    height: 85vh;
    width: 32vw;    
    border-radius: 3vw;    
    background-image: url(/media_files/images/trophy2.jpeg);
    background-size: 100% 100%;   
}

.heroAboutUsTextBox{
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 3vh;
}

/*====================== Marquee ======================*/
#marquee{overflow: hidden;}

.marquee{
    display: flex;   
    align-items: center;    
    gap: 5vw;    
    margin-left: 3vw;    
}

.marquee img{ width: 12vw; height: 25vh; }

.nitiAyogLogo{ width: 10vw !important; height: 15vh !important; }


/*====================== Why Us Section ======================*/
#whyUs{ background-color: #f8f5f2; }

#whyUs h2{
    padding: 4vh 4vw;        
    border-top: solid 1px rgba(128, 128, 128, 0.5);
    border-bottom: solid 1px rgba(128, 128, 128, 0.5);    
}

#whyUs h3, #whyUs h2{color: #103142;}

.whyBoxMain{
    display: flex;         
}

.whyBox{
    display: flex;
    flex-direction: column;
    gap: 5vh;
    padding: 7vh 4vw; 
    border-bottom: solid 1px rgba(128, 128, 128, 0.5);    
}

.whyBox:nth-child(2){
    border-left: solid 1px rgba(128, 128, 128, 0.5);    
    border-right: solid 1px rgba(128, 128, 128, 0.5);        
}

.whyBox p{ line-height: 4.5vh; }

/*====================== Objective Section ======================*/
[data-tab-content] { display: none;}

.active[data-tab-content] { display: block;}


#objective{ 
    background-color: #f1f0fd; 
    padding: 10vh 0;
}

#objective h1{ 
    text-align: center;
    color: #103142;
}

#objective h6{ z-index: 7; }

#objective .tabs{ 
    width: 94%;
    display: flex;
    justify-content: space-between;
    text-align: center; 
    margin-inline: 3%;
    padding: 10vh 0 5vh 0;   
    border-bottom: solid 2px #103142;    
}

#objective .tab{ 
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 16vw;
    height: 16vw;
    border: solid 3px #103142 ;
    border-radius: 25px;
    transition: 0.3s all;    
}

#objective .tab::before{
    content:'';
    height: 100%;
    width: 100%;
    position: absolute;
    background-color: var(--mainPink);
    border-radius: 50%;  
    transform: scale(0);    
    transition: 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

#objective .tab.active::before{ transform: scale(1); }

#objective .tab.active{
   border-radius: 50%;
   border: transparent;
   color: white;
}


#objective .tabContainMain{ 
    width: 80%;
    margin-inline: 10%;
    padding-top: 5vh;    
}

#objective .tabContainMain p{ 
   color: #172135; 
   font-weight: 500;
}

/*====================== CardBox Section ======================*/
#cardBoxMainOuter{ background-color: #f1f0fd; }

#cardBoxMain{
    position: relative;
    display: flex;
    justify-content: space-evenly;
    padding: 15vh 0;    
    width: 98%;
    margin-inline: 1%;
    border-radius: 25px;    
    background: url(../media_files/images/card2.jpg) center fixed;    
    background-size: cover;         
}

#cardBoxMain::before{
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #033F63; 
    opacity: 0.5;
    border-radius: 25px;
}

.cardBox{
    height: 70vh;
    width: 25vw;
    background-color: white;
    border-radius: 25px;
    overflow: hidden;    
    border: solid 1px transparent;
    z-index: 7;
}

/* .cardBox:hover{border: solid 1px rgba(128, 128, 128, 0.5);} */

.cardBox img{
    height: 45%;
    width: 100%;    
}

.cardBox .cardBoxText{
    height: 55%;       
    width: 86%;    
    margin-inline: 7%;    
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3vh;     
}

.cardBox p{ font-size: 1.1vw; }

.cardBox h3{ color: #103142; }

.cardBox a{ color: var(--mainPink); text-transform: capitalize; border-bottom: solid 1px var(--mainPink); }

.cardBox i{ font-size: 1.1vw; transition: 0.3s all;}

.cardBox a:hover i{ margin-left: 0.5vw; }

/*====================== Counter ======================*/
.counterBox{
    display: flex;
    justify-content: center;    
    background-color: #f1f0fd;   
    padding: 10vh 0 10vh 0; 
}

.counterBox h2{font-weight: 420;}

.counterInnerBox{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2vw;
    width: 70%;     
}

.counterBox img{
    height: 10vw;
    width: 10vw;
    border-radius: 50%;
}

.counterBox .counter{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: solid 2px #103142;
    border-radius: 120px;
    height: 20vh;    
    width: 25vw;    
}


/*====================== Video Section ======================*/
.videoMainBox{
    display: flex; 
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;   
    gap: 2.5vw;
}

.videoMainBox iframe{
    height: 50vh;
    width: 40vw;
    border-radius: 1vw;
}


/*====================== Testimonial Section ======================*/
#testimonialSection{ 
    display: flex;
    flex-direction: column;
    gap: 3vh;
    padding: 5vh 0 10vh 0;
    background-color: #f8f5f2;   
    overflow: hidden; 
}

#testimonialSection h2{color: #103142;}

.testimonialTopText{ text-align: center; padding-bottom: 5vh; }

.testimonialTopText p{ padding-top: 2vh;}

.testimonialBox{
    display: flex;    
    gap: 2vw;
}

#testimonialSection .testimonial{
    display: flex;   
    align-items: center;
    height: 30vh;       
    padding: 1vw;
    border-radius: 25px;   
    background-color: white;
    border: solid 1px rgba(128, 128, 128, 0.2);
}

#testimonialSection img{ 
    height: 8vw !important; 
    width: 8vw !important; 
    border-radius: 50%;
    padding: 0 2%;
}

.testimonialTextBox{
    display: flex; 
    flex-direction: column; 
    justify-content: space-between;
    height: 80%; 
    width: 60vw;        
}

#testimonialSection img{ 
    height: 8vw !important; 
    width: 8vw !important; 
    border-radius: 50%;
}

#testimonialSection .testimonialBox p{ font-size: 1vw; width: 98%; text-align: justify; }

#testimonialSection .testName{ font-size: 1.2vw !important; font-weight: 500;}

#testimonialSection .testimonialBox2 .testimonial{ height: 18vh; padding: 1vw; }

.testimonialBox2 .testimonialTextBox{    
    height: 80%; 
    width: 40vw;            
}

.testimonialBox3 .testimonialTextBox{    
    height: 80%; 
    width: 45vw;            
}

.testimonialBox1{ margin-left: 2vw; animation: looping1 50s infinite linear; transform: translateX(-280%); }

@keyframes looping1 {
    0% { transform: translateX(-280%); }
    100% { transform: translateX(10%); }
}

.testimonialBox2{ animation: looping2 80s infinite linear; transform: translateX(-490%);}

@keyframes looping2 {
    0% { transform: translateX(10%); }
    100% { transform: translateX(-490%); }
}

.testimonialBox3{ animation: looping3 45s infinite linear; transform: translateX(-250%);}

@keyframes looping3 {
    0% { transform: translateX(-250%); }
    100% { transform: translateX(10%); }
}


/*====================== Footer ======================*/
footer{    
    background-color: var(--mainBlue);        
    display: flex;
    justify-content: space-between;
}

footer .footerParts{     
    margin: 7vh 0;
    display: flex;
    flex-direction: column;    
    gap: 4vh;    
}

footer p{ color: white;  font-size: 1.2vw; font-weight: 400; }

footer .footerParts1{ width: 25%; text-align: center; gap: 1.5vh; margin-left: 3vw;} 
footer .footerParts2{ width: 18%; margin-left: 5vw;} 
footer .footerParts3{ width: 15%;} 
footer .footerParts4{ width: 30%;} 

footer img{width: 8vw;}
/* .footer img{opacity: 0;}
.footer .footerParts1 p{ opacity: 0;}  */

footer h6{font-size: 1.3vw; color: var(--mainPink); font-weight: 550;} 
/* .footer h6{transform: translateY(10vh); opacity: 0;}  */

/* .footer .footerParts2 a, .footer .footerParts3 a{transform: translateY(10vh); opacity: 0;}  */

footer .footerIconText{display: flex; align-items: center; gap: 1vw}

footer .footerAddressPara{font-size: 1.1vw; margin-top: 1.5vh;}

footer .footerLogoPara{font-size: 1.1vw; text-align: center; width: 95%; font-weight: 300;}
footer .footerLogoPara:hover{ color: white;}
footer .footerIconText1 p:hover{ color: white;}

footer i{font-size: 1.5vw; color: var(--mainPink);}

footer p{font-weight: 500;}

footer p:hover{color: var(--mainPink);}

/* footer .footerPart4Div{transform: translateY(10vh); opacity: 0;} */




/*====================== Gallery Page ======================*/
#gallery{    
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    margin: 0 auto;
    padding: 7vh 0;
    background: #f8f5f2;
    gap: 2vw;    
}

#gallery > img {    
    height: 40vh;
    width: 30%;
    border-radius: 12px; 
}


/*===================== Nomination Page =====================*/
#nominationDiv{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f1f1ff;    
    padding: 10vh 0;           
}

#nominationbox{    
    width: 90%;
    background-color: white;
    border: solid 1px rgba(128, 128, 128, 0.5);
    border-radius: 12px;   
}

#nominationbox h4{ margin: 7vh 0; text-align: center; color: #133e54; }

#nominationbox .formdiv{display: flex; justify-content: space-evenly;}

#nominationbox .formdivcat{display: flex; justify-content: start; margin-left: 3.5vw;}

#nominationbox .formdiv2{display: flex; justify-content: space-evenly;}

.formfileAddress{width: 10vw;}

#nominationbox .formfile{
    display: flex;
    flex-direction: column;
    margin-top: 3vh;
}

#nominationbox .formfile span{
  display: inline-block;
  font-size: 1.2vw;  
  font-weight: 450;
  margin-left: 3%;  
}

#nominationbox form input,  #nominationbox form select{
    border: 1px solid #10314223;
    background: #f5f5f56a;
    margin: 1vw 0 ;
    padding: 1.5vh;
    outline: none;    
    font-size: 1.2vw;
    border-radius: 5px;
    width: 25vw;    
    color: var(--mainBlue);
    font-weight: 450;
} 


textarea{
    border: 1px solid #10314223;
    background: #f5f5f56a;
    margin: 0.5vw 0 ;
    padding: 1.5vh;
    outline: none;    
    font-size: 1.2vw;
    border-radius: 5px;
    width: 40vw;        
    font-weight: 450;  
} 

#nominationbox #buttonDiv{ text-align: center; width: 100%;}

#nominationbox form button{margin: 5vh 0; font-family: "Inter", serif;}




/*===================== Contact Us Page =====================*/
#contactUs{    
    display: flex;
    background-color: #f1f1ff;    
    color: #033F63;
    padding: 10vh 0 5vh 0;    
}

.contactDetails{
    display: flex;
    flex-direction: column;
    gap: 5vh;
    width: 40%;
    margin-inline: 5%;    
}

.contactDetails p{ line-height: 4.5vh; text-align: justify; }

.contactDetails i{ font-size: 1.3vw; }

.contactDetailsReachUs{
    display: flex;
    flex-direction: column;
    gap: 3vh;
    font-weight: 420;
}

.contactAddress{ display: flex; align-items: center; }

.contactDetailsReachUs i{margin-right: 1vw; color: var(--mainPink);}

.contactUsSocial i{
    font-size: 1.7vw; 
    margin-right: 3vw; 
    margin-top: 3vh;
    color: var(--mainPink);
    border: solid 1px var(--mainPink);
    border-radius: 50%;
    padding: 2vh 1.2vw;
}

.contactUsSocial i:hover{ color: white; background-color: var(--mainPink); }

.contactForm{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    background-color: white;    
    height: fit-content;
    width: 50%;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    border: solid 1px rgba(128, 128, 128, 0.3);
    padding: 7vh 5vw 3vh 5vw;
}

.contactForm h4{margin-bottom: 3vh;}

#contactUs .formdiv{display: flex; justify-content: space-between;}

#contactUs  .formfile{
    display: flex;
    flex-direction: column;
    margin-top: 3vh;
}

#contactUs  .formfile span{
  display: inline-block;
  font-size: 1.2vw;  
  font-weight: 450;
  margin-left: 3%;  
}

#contactUs  form input,  #contactUs form select{
    border: 1px solid #10314223;
    background: #f5f5f56a;
    margin: 1vw 0 ;
    padding: 1.5vh;
    outline: none;    
    font-size: 1.2vw;
    border-radius: 5px;
    width: 120%;    
    color: var(--mainBlue);
    font-weight: 450;
} 


#contactUs textarea{
    border: 1px solid #10314223;
    background: #f5f5f56a;
    margin: 0.5vw 0 ;
    padding: 1.5vh;
    outline: none;    
    font-size: 1.2vw;
    border-radius: 5px;
    width: 109%;        
    font-weight: 450;  
} 

#contactUs .commentSpan{ margin-left: 1.5% !important; }

#contactUs form button{ margin: 5vh 0; font-family: "Inter", serif; }

.contactMap{
    background-color: #f1f1ff;    
    padding-bottom: 5vh;    
}

.contactMap iframe{
    height: 60vh;
    width: 94%;    
    border-radius: 25px;
    margin-inline: 3%; 
}



/*===================== About Us Page =====================*/
/*===================== About Us Section =====================*/
#aboutUs{
    box-sizing: border-box;
    background-color: #e6f5f0;
    padding: 7vh 5vw;
}

#aboutUs h2{ color: #033F63; }

#aboutUs .aboutUsTop{display: flex; align-items: center;}

#aboutUs .aboutUsLeft{
    display: flex;
    flex-direction: column;
    gap: 3vh;
    width: 40%;    
    margin-bottom: 5vh;
}

#aboutUs img{
    height: 65vh;
    width: 45vw;
    margin-left: 5vw;
    border-radius: 60px;
}

#aboutUs .aboutUsBottom{
    display: flex;
    flex-direction: column;
    text-align: justify;
    gap: 2vh;
}

#aboutUs p{line-height: 4.5vh;}


/*===================== Our Organization Section =====================*/
#aboutUsorganization{
    display: flex;
    flex-direction: column;
    gap: 2vh;
    padding: 5vh 5vw;
}

#aboutUsorganization h2{text-align: center; margin-bottom: 3vh; color: #033F63;}

#aboutUsorganization p{text-align: justify; line-height: 4.5vh;}


/*===================== Our Aim Section =====================*/
#aboutUsaim{ 
    display: flex;    
    align-items: center;
    background-color: #f8f5f2; 
    padding: 10vh 0; 
}

#aboutUsaim img{
    height: 80vh;
    width: 45%;    
    border-top-right-radius: 600px; 
    border-bottom-right-radius: 600px; 
}

.aboutUsVision img{ height: 90vh !important; }

#aboutUsaim h3{ color: #033F63;}

.picSideTextBox{
    display: flex;
    flex-direction: column;
    gap: 3vh;
    margin-inline: 5%;    
    width: 45%;    
}

.picSideTextBox p{text-align: justify; line-height: 5vh;}


/*===================== Our Mission Section =====================*/
#aboutUsmission{ 
    display: flex;    
    align-items: center;
    background-color: white; 
    padding: 10vh 0; 
}

#aboutUsmission img{
    height: 90vh;
    width: 45%;    
    border-top-left-radius: 600px; 
    border-bottom-left-radius: 600px; 
}

#aboutUsmission h3{ color: #033F63;}




/*===================== Award Page =====================*/
.award{
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    padding: 10vh 5vw;
}

.award img{    
    width: 40%;
    border-radius: 50px;
    object-fit: cover;
}

.awardTextBox{ width: 55%; }

.awardTextBox p{ line-height: 4.5vh; padding-bottom: 2vh;}


/*===================== Return & Refund Page =====================*/
#return{ text-align: center; padding: 15vh 5vw; }    


/*===================== Privacy Policy Page =====================*/
.privacyBox1, .privacyBox3, .privacyBox5{ background-color: #e6f5f0; }

.privacyBox2, .privacyBox4, .privacyBox6{ background-color: #f8f5f2; }

#privacyPolicy .privacyBox1{ padding: 7vh 5vw 5vh 5vw; }

.privacyBox2, .privacyBox3 , .privacyBox4, .privacyBox5 { padding: 3vh 5vw 3vh 5vw; }

.privacyBox6{ padding: 3vh 5vw 7vh 5vw; }

#privacyPolicy p{
    line-height: 4.5vh;
    margin-bottom: 2vh;
}

#privacyPolicy h3, #privacyPolicy h4{margin: 3vh 0 1vh 0; color: #103142;}

#privacyPolicy a{font-family: "Inter", serif; color: #4a4a52; font-weight: 600;}

#privacyPolicy ul{ margin-left: 3vw; }