body {
    background-color: beige;
    box-sizing: border-box;
}
#myCarousel{
    width: 50vw;
}
/* navigation */
.nav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    position: fixed;
    position: relative;
    top: 0;
    width: 100%;
    border-bottom: 0.2vw solid white;
}

.nav li {
    float: left;
}

.nav li a {
    display: block;
    color: white;
    text-align: center;
    padding: 2vh 3vw;
    text-decoration: none;
    font-size: 1.5vw;
}

.nav li a:hover:not(.active) {
    background-color: #111;
}

.nav .active {
    background-color: yellow;
    color: black;
}

/* nav-ends */
.katha:hover {
    box-shadow: 0.3vw 0.3vw 0.8vw whitesmoke;
}

.m {
    height: 25vh;
    width: 100vw;
    background-color: maroon;
}

.m img {
    height: 20vh;
    width: 12vw;
    margin: 0.5vw;
}

.m h2 {
    color: white;
    font-size: 3vw;
}

.m h3 {
    color: yellow;
    font-size: 2vw;
}

/* title-ends  */
.container {
    width: 30vw;
    height: 30vh;
    margin: 2vw;
    position: absolute;
    top: 38vh;
    left: 5vw;
}

.ev {
    height: 50vh;
    width: 90vw;
    background-color: yellowgreen;
    position: relative;
    top: 55vh;
    /* margin: 2vw; */
    display: flex;
    padding: 5vw;
}

.ev td {
    width: 65vh;
    height: 30vh;
    border: 0.3vw dotted whitesmoke;
    color: white;
    font-size: 3vw;
    font-family: Georgia, 'Times New Roman', Times, serif;
    /* border-top-left-radius: 50%;
    border-bottom-left-radius: 50%; */
    /* text-align: right; */

}

.ev img {
    width: 10vw;
    height: 15vh;
}

aside {
    position: absolute;
    width: 38vw;
    height: 45vw;
    margin: 2vw;
    top: 33vh;
    right: 0vw;
    background-color: beige;
    font-size: 1.5vw;
    color: maroon;
    padding: 5.5vw 5vw;
    font-family: cursive;
    box-shadow: 0.5vw 0.5vw 0.8vw maroon;
    border-top-left-radius: 30%;
    border-bottom-right-radius: 30%;
    border: 0.2vw solid yellow;
    text-align: justify;
    font-weight: 700;
}

aside img {
    position: absolute;
    top: 50vh;
    left: -10vw;
    width: 28vw;
    height: 40vh;
}

.container button {
    position: absolute;
    top: 160vh;
    left: 25vw;
    background-color: yellow;
    font-size: 4vw;
    font-family: cursive;
    color: maroon;
    padding: 3%;
    height: 20vh;
    width: 20vw;
    border-radius: 50%;
    border: 0.5vw solid maroon;
}

.container button:hover {
    border: 0.5vw solid yellow;
    background-color: maroon;
    color: yellow;
}

.container2 button:hover {
    border: 0.5vw solid yellow;
    background-color: maroon;
    color: yellow;
}

.container2 button {
    position: absolute;
    top: 132vh;
    right: 21vw;
    background-color: yellow;
    font-size: 2vw;
    font-family: cursive;
    color: maroon;
    padding: 3%;
    height: 20vh;
    width: 20vw;
    border-radius: 50%;
    border: 0.5vw solid maroon;
}

#demo img {
    position: absolute;
    top: 10vh;
    left: 5vh;
}

.container button:hover img {
    height: 120vh;
}

.ima {
    position: absolute;
    top: 100vh;
    left: 15vh;
    width: 50vw;
    height: 100vh;
}

/* footer {
    background-color: #333;
    position:relative;
    margin-top: 20vh;
    /* top: 20vh; */
/* left: 0%;
    height: 40vh;
    width: 100%;
    color: white;
}

footer img {
    height: 25vh;
    width: 13vw;

} */
*/ .principle {
    color: rgb(20, 110, 20);
    font-size: 2vw;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.principle img {
    height: 50vh;
    width: 35vw;
    border: 0.5vw solid midnightblue;

}

.side {
    position: absolute;
    right: 3vw;
    top: 35vh;
    height: 60vh;
    width: 20vw;

}

.side2 {
    width: 15vw;
    height: 50vh;
    position: absolute;
    top: 100vh;
    /* transform: scaleX(70vh); */
}

.side3 {
    width: 50vw;
    height: 80vh;
    margin: 5%;
    border-radius: 2%;
    border: 0.3vw solid magenta;
    position: relative;
    top: 40vh;
    left: 40vh;

}

.fac {
    margin: 0%;
    width: 80vw;
    height: 60vh;
    border: 0.5vw solid maroon;
    color: rgb(7, 37, 7);
    font-size: 1.8vw;
    font-family: cursive;
    text-align: justify;
    font-weight: 700;

}

.fac img {
    width: 45vw;
    height: 50vw;
    border: 0.2vw solid mediumblue;
}

.fac h2 {
    color: maroon;
    font-size: 2vw;
}

.div1 {
    height: 60vh;
}

/* footer {
    background-color: #333;
    top: 420vh;
    left: 0%;
    height: 40vh;
    width: 100%;
    color: white;
} */

.donate {
    background-color: wheat;
    line-height: 4vh;
    padding: 0.1% 10%;
    margin: 0%;
    color: maroon;
    font-size: 2vw;
    text-align: left;
}

.even {
    height: 150vh;
    width: 90vw;
    position: relative;
    top: 5vw;
    left: 5vw;
    color: maroon;
    font-size: 2vw;
    font-weight: 800;
    margin: 0;
}

/* .even p{width: 60%;} */
.even h2 {
    color: mediumblue;
}

.even img {
    width: 30vw;
    height: 25vw;
    /* border-radius: 50%; */
    border: 0.4vw solid mediumblue;
}

.even img:hover {
    border: 0.4vw solid rgb(91, 245, 30);
}

/* .side4 {
    position: absolute;
    top: 110vh;
    left: 2vw;
    height: 95vh;
    width: 30vw;
}

.side5 {
    position: absolute;
    top: 36vh;
    left: 0.2vw;
    width: 25vw;
    height: 63vh;
} */

/* .side6 {
    position: absolute;
    left: 2vw;
    top: 230vh;
    width: 23vw;
    height: 100vw;
} */

.video1 {
    height: 70vh;
    width: 60vw;
    position: absolute;
    top: 340vh;
    left: 20vw;
}

video {
    height: 100vh;
    width: 50vw;
    position: absolute;
    top: 40vh;
    left: 30vw;
}

.p {
    width: 40vw;
    height: 65vh;
    margin: 5%;
    padding: relative;
    top: 30vh;
    left: 10vw;
    border: 0.4vw solid midnightblue;
}

.team {
    color: black;
    width: 95%;
    font-size: 1.5vw;
    position: relative;
    top: 10vh;
    left: 0%;
    border: 0.4vw solid maroon;
    background-color: rgb(247, 198, 244);
}

.team h2 {
    position: relative;
    color: rgb(37, 183, 24);
    font-size: 3vw;
    text-shadow: 0.1vw 0.1vw black;
}

.team img {
    height: 40vh;
    width: 25vw;
    position: relative;
}

/* .team .a {

    animation: example 2s ease-in-out infinite;
}

.team .b {

    animation: example2 2s ease-in-out infinite;
} */

/* @keyframes example {
    0% {
        left: 0px;
        top: 0px;
    }

    100% {
        left: 15vw;
        top: 0px;
    }

}

@keyframes example2 {
    0% {
        right: -20px;
        top: 0px;
    }

    100% {
        right: 6vw;
        top: 0px;
    }

} */

.divv {
    background-image: linear-gradient(to bottom, maroon, pink, beige);
    height: 105vh;
    /* border-bottom: 0.2vw solid maroon; */
    padding-top: 2%;
    border-top: 0.2vw dashed white;
    position: relative;
}

.divv video {
    position:relative;
    top:20vw;
    left: 0vw;
    height: 50vw;
    width: 80vw;
}

.divv ul {
    color: black;
    font-size: 3vw;
    font-family: cursive;
    font-weight: 700;
    padding: 5%;
    /* list-style-type: none; */
}

/* .divv li::first-letter {
    color: blue;
} */

.div5 {
    height: 50vw;
    width: 100%;
    position: relative;
    top: 30vw;
    font-size: 2vw;
    background-image: url("../image/art.jpg");
    background-repeat: repeat-x;
}

.div5 h2 {
    color: maroon;
}

.div5 img {
    height: 20vh;
    width: 7.8vw;
    display: inline-flex;

}

.div5 a:hover {
    background-color: white;
    color: black;
    border: 0.3vw solid black;
}

.div5 ol {
    display: inline-flex;
    list-style-type: none;
}

.ol li {
    background-color: yellow;
    color: maroon;
    padding: 10%;
    border-radius: 50%;
    margin: 0 5%;
    min-width: 30%;
    text-align: center;
    border: 0.5vw solid maroon;
    font-size: 2vw;
}

.ol li:hover {
    background-color: maroon;
    color: yellow;
    border: 0.5vw solid yellow;

}

.div5 .moon {
    position: absolute;
    top: 330%;
    left: 10vw;
    width: 50%;
    height: 180%;
    border: 0.2vw solid black;
}

.div5 a {
    position: relative;
    text-align: center;
    background-color: black;
    text-decoration: none;
    color: white;
    top: 270%;
    left: 20%;
    padding: 2%;

}

.pics {
    position: absolute;
    top: 210%;
    left: 5%;
}

.pics img {
    width: 27vw;
    height: 40vh;
}

.pics img:hover {
    opacity: 0.8;
    border: 0.3vw solid maroon;
}

.cc {
    -webkit-box-reflect: right;
    position: absolute;
    top: 89vh;
    left: 5vw;
    width: 45vw;
    height: 70vh;
    margin: 0 0 6% 0;
}

.mask1 {
    background-image: url(../image/home.jpg);
    background-blend-mode: lighten;
    background-repeat: no-repeat;
    backdrop-filter: ;
    background-size: cover;
    height: 100vh;
    width: 95%;
    font-size: 4vw;
    padding: 5vh 5vw 5vw 0vw;
    color: white;
    text-shadow: 0.4vw 0.4vh 0.1vw black;
    border-bottom-right-radius: 50%;
}

.div-main {
    position: relative;
    top: 20vh;
    left: 0vw;
    width: 89%;
    height: 100px;
    font-size: 1.9vw;
    border: 0.2vw solid maroon;
}

.div-main td {
    display: inline-flex;
    background-color: maroon;
    color: yellow;
    width: 28%;
    margin: 2%;
    height: 220px;
    padding: 2% 0.5%;
}

.div-main ol {
    padding: 2%;
}

.div-main li {
    list-style-type: none;
    margin: 0%;
}

.div4 {
    position: relative;
    width: 100%;
    top: 25vh;
    padding: 5%;
    background-color: yellow;
    font-size: 2vw;
}

.img2 {
    position: relative;
    top: 25vh;
    display: inline-flex;
    width: 27%;
    margin: 2%;
    height: 30vw;
    border: 0.5vw solid rgb(4, 59, 4);
}

.kathaa {
    background-color: yellow;
    width: 100%;
    height: 80vh;
    font-size: 2vw;
    display: inline-flex;
    padding: 2%;
    position: relative;
    top: 8vw;
    margin-bottom: 2%;
}

.kathaa td {
    background-color: white;
    color: maroon;
    width: 28vw;
    height: 40vh;
    left: 10%;
    /* margin: 2% 4% ; */
    border: 0.2vw solid maroon;
}

.kathaa img {
    width: 5vw;
    height: 5vw;
}

.soc {
    display: inline-flex;
    list-style-type: none;
    padding: 10%;
    margin: 5% 5%;
}

.soc li:hover {
    box-shadow: 0.2vw 0.2vw maroon;
}