@import url('https://fonts.googleapis.com/css2?family=Aboreto&family=Beau+Rivage&family=Cinzel+Decorative&family=Cinzel:wght@500&family=Didact+Gothic&family=Emilys+Candy&family=Josefin+Sans&family=Julius+Sans+One&family=Lobster&family=Montez&family=Oswald&family=Playfair+Display+SC&family=Rampart+One&family=Sail&family=Tangerine:wght@700&family=Tilt+Prism&display=swap');

.collapsed .nav_line1 {
    border: 1px solid #fffefd;
    width: 35px;
    height: 1px;
    transition: 1s;
    transform: rotate(0deg);
}

.collapsed .nav_line2 {
    border: 1px solid #ffffff;
    width: 35px;
    height: 1px;
    transition: 1s;
}

.collapsed .nav_line3 {
    border: 1px solid #ffffff;
    width: 35px;
    height: 1px;
    transform: rotate(0deg);
    transition: 1s;
}

.nav_line1 {
    border: 1px solid pink;
    width: 35px;
    height: 1px;
    transition: 1s;
    transform: rotate(-45deg) translate(-10px, 10px);
}

.nav_line2 {
    border: 1px solid rgba(255, 213, 0, 0.043);
    width: 0px;
    height: 1px;
    transition: 1s;
}

.nav_line3 {
    border: 1px solid pink;
    width: 35px;
    height: 1px;
    transform: rotate(45deg);
    transition: 1s;
}

.nav-item {
    cursor: pointer;
    color: #999;
}

.sty {
    opacity: 0;
    animation-name: div_aniamte;
    animation-fill-mode: forwards;
    animation-duration: 1s;
}

@keyframes div_aniamte {
    from {
        opacity: 0;
        transform: translate(0px, 30px);
    }

    to {
        opacity: 1;
        transform: translate(0px, 0px);
    }
}


.cc {
    background-color: rgba(255, 255, 255, 0.525);
    backdrop-filter: blur(10px);
}

.RR {
    background: rgb(242, 58, 153);
    background: linear-gradient(0deg, rgba(242, 58, 153, 0.4282505238423494) 25%, rgba(252, 103, 211, 0.47867069190957634) 53%, rgba(136, 59, 105, 0.4954774145986519) 74%);
    backdrop-filter: blur(10px);
}

.nav_branda_heading {
    font-size: 0.8rem;
}

.nav_branda_heading span {
    font-weight: bold;
}

.vts_h {
    font-family: 'Didact Gothic', sans-serif;
}

.nav_heading {
    font-size: small;
    color: white;
}

.nav_heading_iskcon {
    font-size: x-small;
    color: white;
}

.home_img {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 80%), url("./all_images/diya2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.guruji_quote .timing {
    background-color: white;
}

.guruji_quote .d {
    background-color: pink;
}

.guruji_quote p {
    cursor: pointer;
    color: rgb(254, 86, 114);
}

.guruji_quote p:hover {
    cursor: pointer;
    color: rgb(255, 0, 43);
}

.home_img h1,
h2 {
    font-weight: bolder;
}

.temple_status {
    font-family: 'Emilys Candy', cursive;
    color: rgb(0, 0, 0);
}

.welcome {
    backdrop-filter: blur(20px);
    background-color: aliceblue;
}

.what_to_visit {
    background-color: rgba(244, 240, 240, 0.671);
    background-size: cover;
    background-position: center;
}

.what_to_visit p {
    font-family: 'Didact Gothic', sans-serif;
    font-size: large;
    text-align: center;
}

.what_to_visit_heading {
    font-family: 'Montez', cursive;
    color: rgb(239, 40, 150);
}

.visit_1 {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/gurukul.jpg");
    background-size: cover;
    background-position: 40%;
    height: 25rem;
    transition: 1s;
    box-shadow: 4px 4px 10px rgb(129, 129, 129);
}

.visit_1 svg {
    color: white;
    opacity: 1;
    transform: translate(0px, 0px);
    transition: 1s;
}

.visit_1 h4 {
    transform: translate(0px, 0px);
    transition: 1s;
    color: yellow;
}

.visit_1:hover {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/gurukul.jpg");
    background-size: cover;
    background-position: 50%;
    height: 25rem;
    transition: 1s;
    box-shadow: 4px 4px 10px rgb(129, 129, 129);
}


.visit_2 {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/temple.JPG");
    background-size: cover;
    background-position: 40%;
    height: 25rem;
    transition: 1s;
    box-shadow: 2px 2px 5px rgb(126, 125, 125);
}

.visit_2 svg {
    color: white;
    transition: 1s;
}

.visit_2 h4 {
    transition: 1s;
    color: yellow;
}

.visit_2:hover {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/temple.JPG");
    background-size: cover;
    background-position: 50%;
    height: 25rem;
    transition: 1s;
    box-shadow: 4px 4px 10px rgb(125, 124, 124);
}


.visit_3 {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/cow1.jpg");
    background-size: cover;
    background-position: 40%;
    height: 25rem;
    transition: 1s;
}

.visit_3 svg {
    color: white;
    transition: 1s;
}

.visit_3 h4 {
    transition: 1s;
    color: yellow;
}

.visit_3:hover {
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(235, 136, 176, 0.672) 20%, rgba(66, 65, 65, 0.6467379188003326) 80%), url("./all_images/cow1.jpg");
    background-size: cover;
    background-position: 50%;
    height: 25rem;
    transition: 1s;
}


.temple_img_border {
    border: 10px solid rgb(239, 40, 150);
    border-bottom: 0px;
    border-right: 0px;
}


.home_img h2 {
    color: white;
    font-family: 'Aboreto', cursive;
    font-family: 'Beau Rivage', cursive;

    text-align: center;
}

.home_img h1 {
    font-family: 'Cinzel Decorative', cursive;
    text-align: center;
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
}

.temple_text p {
    font-family: 'Josefin Sans', sans-serif;
    text-align: justify;
}

.temple_text {
    overflow: hidden;
}

.temple_text h2 {
    color: rgb(239, 40, 150);
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    font-family: 'Montez', cursive;
}

.temple_text img {
    border: 10px solid rgb(239, 40, 150);
    border-bottom: 0px;
    border-right: 0px;
}


.goshala h2 {
    color: rgb(239, 40, 150);
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    font-family: 'Montez', cursive;
}

.goshala {
    overflow: hidden;
}

.goshala img {
    border: 10px solid rgb(239, 40, 150);
    border-top: 0px;
    border-left: 0px;
    box-shadow: 3px 3px 2px rgba(135, 135, 135, 0.548);
}

.goshala p {
    font-family: 'Josefin Sans', sans-serif;
    text-align: justify;
}



.what_to_visit_at_temple {
    background: rgb(66, 64, 64);
    background: rgb(66, 64, 64);
    background: linear-gradient(180deg, rgba(66, 64, 64, 0.3470180308451506) 8%, rgba(66, 65, 65, 0.2797911400888481) 94%), url("./all_images/back_4.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.diwali_heading {
    font-family: 'Sail', cursive;
    background-color: rgb(251, 149, 166);
    color: white;
    box-shadow: 0px 0px 10px yellow;
}

.what_to_visit_at_temple h1 {
    font-family: 'Sail', cursive;
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
}

.space_adding {
    height: 10vh;
}

.gurukul_img1 {
    transform: translate(30px, -20px);
}

.gurukul_img2 {
    transform: translate(-30px, 20px);
}

.gurukul {
    /* background: rgb(254,254,254); */
    background: linear-gradient(165deg, rgba(254, 254, 254, 0.2629844173997724) 6%, rgba(253, 254, 254, 0.3106034650188201) 72%), url("./all_images/gurukul.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    overflow: hidden;
}

.gurukul_h_p {
    color: white;
    background-color: rgba(240, 248, 255, 0.349);
    backdrop-filter: blur(3px);
    border-radius: 10px;
    /* background-color: rgba(234, 66, 147, 0.37); */
    text-align: justify;
}

.gurukul_h_p h2 {
    color: rgb(239, 106, 40);
    font-family: 'Montez', cursive;
}

.gurukul_h_p p {
    font-family: 'Josefin Sans', sans-serif;
    text-align: justify;
}

.gallery h1 {
    color: rgb(239, 40, 150);
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    font-family: 'Montez', cursive;
    font-family: 'Cinzel Decorative', cursive;
}

.gallery p span {
    font-size: 14px;
    color: rgb(239, 40, 150);
    font-family: 'Montez', cursive;
    font-family: 'Josefin Sans', sans-serif;
}

.gallery {
    overflow: hidden;
}

.gallery p {
    font-family: 'Josefin Sans', sans-serif;
}

.gallery .card {
    background-color: pink;
}


.carousel-item {
    height: 350px;
}

.carousel-indicators li {
    width: 10px;
    height: 10px;
    border-radius: 100%;
}

.carousel-indicators {
    bottom: -80px;
}






.foot {
    background-color: cornsilk;
}

/* calender  */
.calender h1 {
    font-family: 'Cinzel Decorative', cursive;
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    color: rgb(239, 40, 150);
}

.calender {
    overflow: hidden;
}

.calender ul li {
    color: white;
}

.calender_body {
    background: linear-gradient(180deg, rgba(93, 92, 92, 0.493) 20%, rgba(66, 65, 65, 0.434) 80%), url("./all_images/dd_3.jpeg");
    /* background: linear-gradient(180deg, rgba(93, 92, 92, 0.493) 20%, rgba(66, 65, 65, 0.434) 80%) , url("./all_images/temple2.jpeg"); */
    background-size: cover;
    background-attachment: fixed;
    background-position: 93%;
}

.cal_events p {
    color: white;
    text-align: start;
}

.cal_events {
    width: 100%;
    background-color: rgba(212, 212, 212, 0.393);
    backdrop-filter: blur(10px);
}

/* fests */
.project_1_expands {
    display: none;
    transition: 1s;
}

.project_2_expands {
    display: none;
    transition: 1s;
}

.project_3_expands {
    display: none;
    transition: 1s;
}

.project_1_expands_anime {
    display: block;
}

.project_img_animation {
    animation-name: project_images;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

@keyframes project_images {
    from {
        transform: translate(0px, 40px);
        opacity: 0;
    }

    to {
        opacity: 1;
        transform: translate(0px, 0px);
    }
}

.project_img_r {
    animation-name: project_img_r;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    overflow: hidden;
}

body {
    overflow-x: hidden;
}

@keyframes project_img_r {
    from {
        align-self: center;
        transform: translate(40px, 0px);
        opacity: 0;
        overflow: hidden;
    }

    to {
        opacity: 1;
        overflow: hidden;
        transform: translate(0px, 0px);
    }
}

/* fests */
.crsPartner h1 {
    font-family: 'Cinzel Decorative', cursive;
    text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    color: rgb(239, 40, 150);
}

.crsPartner p {
    font-size: 10px;
}


@media screen and (max-width: 768px) {
    .nav_branda_heading {
        font-size: 0.57rem;
    }

    .nav_branda_heading span {
        font-size: 0.7rem;
    }

    .foot p {
        font-size: 11px;
    }

    .mail {
        font-size: 13px;
    }

    .foot .first_p {
        font-size: 10px;
    }

    .what_to_visit p {
        font-size: 1.1rem;
        text-align: justify;
    }

    .temple_text img {
        border: 7px solid rgb(239, 40, 150);
        border-bottom: 0px;
        border-right: 0px;
    }

    .goshala img {
        border: 7px solid rgb(239, 40, 150);
        border-top: 0px;
        border-left: 0px;
        box-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    }

    .temple_status {
        font-family: 'Emilys Candy', cursive;
        color: rgb(0, 0, 0);
        font-size: 18px;
    }

    .crsPartner p {
        font-size: 5px;
    }

    .gallery h1 {
        color: rgb(239, 40, 150);
        text-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
        font-family: 'Montez', cursive;
        font-family: 'Cinzel Decorative', cursive;
        font-size: 18px;
    }

}


@media screen and (max-width: 360px) {
    .nav_branda_heading {
        font-size: 0.5rem;
    }

    .nav_branda_heading span {
        font-size: 0.6rem;
    }

    .foot p {
        font-size: 11px;
    }

    .mail {
        font-size: 13px;
    }

    .foot .first_p {
        font-size: 10px;
    }

    .what_to_visit p {
        font-size: 1.1rem;
        text-align: justify;
    }

    .temple_text img {
        border: 7px solid rgb(239, 40, 150);
        border-bottom: 0px;
        border-right: 0px;
    }

    .goshala img {
        border: 7px solid rgb(239, 40, 150);
        border-top: 0px;
        border-left: 0px;
        box-shadow: 3px 3px 5px rgba(135, 135, 135, 0.548);
    }

    .temple_status {
        font-family: 'Emilys Candy', cursive;
        color: rgb(0, 0, 0);
        font-size: 18px;
    }
}

@media screen and (max-width: 332px) {
    .nav_branda_heading {
        font-size: 0.36rem;
    }

    .nav_branda_heading span {
        font-size: 0.4rem;
    }
}