body {
    background-color: whitesmoke;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}


.institute_head_alignment {
    /*margin: 150px 0 200px 0;*/
    margin-top: 150px;
    margin-bottom: 150px;
    background-color: white;
    padding: 30px;
    /*border: 1px solid gray;*/
}

.w-full {
    width: 100%;
}


.bordered-p {
    border: 1px dotted gray;
    padding: 10px 0;
}

.bordered {
    border: 1px dotted gray;
}

.hidden {
    visibility: hidden;
}

.btn-info {
    background-color: #3bc3e9 !important;
    border: 1px solid #3bc3e9 !important;
}

.home-logo {
    transform: scale(1.3) !important;
}

.home-text {
    margin-left: 25px !important;
}


.gallary {
    --l: calc(100vw/var(--n-cols));
    --hl: calc(.5*var(--l));
    /*--hl: calc(.5*var(--l));*/
    --ri: calc(.5*1.73205*var(--l));
    box-sizing: border-box;
    display: grid;
    place-content: center;
    grid-template: repeat(var(--n-rows), var(--l))/repeat(var(--n-cols), var(--ri));
    grid-gap: var(--hl) 0;
    overflow: hidden;
    /*margin: 0;*/
    padding: var(--hl) 0;
    height: 100vh;
    filter: drop-shadow(2px 2px 5px);
    transform: rotateZ(30deg);
    --n-rows: 3; --n-cols: 6;
    margin-top: -55px;

}
@media (orientation: landscape) {
    .gallary {
        --l: calc(55vh/(var(--n-rows) + 1));
    }
}
.hex-cell {
    overflow: hidden;
    grid-column-end: span 2;
    margin: calc(-1*var(--hl)) 0;
    transform: scale(1.1);
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.gallary a {
    --hl: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(calc(1 + .2*var(--hl)));
    /*filter: brightness(calc(.6*(1 + var(--hl))));*/
    transition: .7s;
}
.gallary a:hover {
    --hl: 1;
}
.hexa-design1{
    /*color: greenyellow;*/
    display: grid;
    /*background: linear-gradient(to right, #ae1c22 0%, #30545f 100%);*/
    align-items: center;
    text-align: center;
    align-content: center;
    /*background-repeat: no-repeat;*/
    background-size: contain;
    height: 100%;
    width: 100%;


}
.hexa-design2{
    display: grid;
    background: #15616d;
    align-items: center;
    text-align: center;
    align-content: center;
}
.hexa-design3{
    display: grid;
    background: #d10b11;
    align-items: center;
    text-align: center;
    align-content: center;
}
.hexa-design4{
    display: grid;
    background: #003049;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hex-cell:nth-of-type(5n + 1) {
    grid-column-start: 2
}

/*.text-align-design{*/
/*    margin-top: auto;*/
/*    margin-bottom: auto;*/
/*    !*color: #ffffff !important;*!*/
/*    !*font-size: 24px;*!*/
/*    filter: brightness(2) !important;*/
/*    !*transform: rotateZ(-30deg)*!*/
/*    position: relative;*/
/*    top: 50px;*/
/*    font-size: 14px;*/
/*    font-weight: 700;*/
/*    color: white;*/
/*}*/



@media (min-width: 320px) and (max-width: 375px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 34px;
        font-size: 8px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: 14px;
        margin-left: -25px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 195px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 100px;
        margin-left: -48px;
        transform: rotateZ(-30deg);
        font-size: 18px;
        position: relative;
        top: -30px;
        left: 9px;
    }


}
@media (min-width: 376px) and (max-width: 425px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 38px;
        font-size: 8px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;


        transition: none 0s ease 0s;
        cursor: move;
        position: relative;
        left: -73px;
        top: 24px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: -15px;
        margin-left: 16px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -5px;
        left: -395px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        will-change: top, left;


        transition: none 0s ease 0s;
        cursor: move;
        position: relative;
        left: 357px;
        top: 186px;
    }


}
@media (min-width: 426px) and (max-width: 454px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 43px;
        font-size: 8px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: -15px;
        margin-left: 16px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -5px;
        left: -395px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}
@media (min-width: 455px) and (max-width: 600px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 48px;
        font-size: 8px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 84px;
        margin-left: -43px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -90px;
        left: -370px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}
@media (min-width: 601px) and (max-width: 800px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 48px;
        font-size: 10px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 109px;
        margin-left: -60px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -90px;
        left: -370px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}
@media (min-width: 801px) and (max-width: 1024px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 48px;
        font-size: 12px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 109px;
        margin-left: -60px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -90px;
        left: -370px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}
@media (min-width: 1025px) and (max-width: 1624px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 49px;
        font-size: 13px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 109px;
        margin-left: -60px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -90px;
        left: -370px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}
@media (min-width: 1625px) and (max-width: 2000px) {
    .text-align-design{
        margin-top: auto;
        margin-bottom: auto;
        filter: brightness(2) !important;
        position: relative;
        top: 49px;
        font-size: 14px;
        font-weight: 700;
        color: white;
    }
    .think-align-home{
        color: #d10b11;
        margin-top: -110px;
        margin-left: 272px;
        transform: rotateZ(-30deg);
        font-size: 23px;
    }
    /*.think-align-home> span{*/
    /*    margin-left: 350px;*/
    /*    position: relative;*/
    /*    left: 2px;*/
    /*    top: -41px;*/
    /*}*/
    .think-align-home2{
        color: #d10b11;
        margin-top: 109px;
        margin-left: -60px;
        transform: rotateZ(-30deg);
        font-size: 22px;
        position: relative;
        top: -90px;
        left: -370px;
    }

    .think-align-home2 > span{
        /*border: 1px solid red;*/
        font-size: 22px;
        left: 388px;
        top: 200px;
        position: relative;
        will-change: top, left;
        transition: none 0s ease 0s;
        cursor: move;
    }


}



/*@media screen and (max-width: 320px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 30px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*    }*/
/*    .think-align-home2{*/
/*        color: #d10b11;*/
/*        margin-top: 109px;*/
/*        margin-left: -60px;*/
/*        transform: rotateZ(-30deg);*/
/*        font-size: 22px;*/
/*        position: relative;*/
/*        top: -45px;*/
/*        left: 9px;*/
/*    }*/
/*}*/

/*@media screen and (max-width: 375px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 35px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*    }*/
/*}*/

/*@media screen and (max-width: 425px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 47px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*    }*/
/*}*/


/*@media screen and (max-width: 768px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 55px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*        border: 1px solid #12e815;*/
/*    }*/

/*}*/

/*@media screen and (max-width: 1024px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 52px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*        border: 1px solid red;*/
/*    }*/
/*    .think-align-home2{*/
/*        color: #d10b11;*/
/*        margin-top: 50px;*/
/*        margin-left: 450px;*/
/*        transform: rotateZ(-30deg);*/
/*        font-size: 28px;*/
/*    }*/

/*}@media screen and (max-width: 1632px) {*/
/*    .text-align-design{*/
/*        margin-top: auto;*/
/*        margin-bottom: auto;*/
/*        filter: brightness(2) !important;*/
/*        position: relative;*/
/*        top: 52px;*/
/*        font-size: 10px;*/
/*        font-weight: 700;*/
/*        color: white;*/
/*        border: 1px solid red;*/
/*    }*/
/*    .think-align-home2{*/
/*        color: #d10b11;*/
/*        margin-top: 50px;*/
/*        margin-left: 450px;*/
/*        transform: rotateZ(-30deg);*/
/*        font-size: 28px;*/
/*    }*/

/*}*/





/*.think-align-home{*/
/*    color: #d10b11;*/
/*    margin-top: 90px;*/
/*    margin-left: -40px;*/
/*    transform: rotateZ(-30deg);*/
/*    font-size: 23px;*/
/*}*/





/*.think-align-home2{*/
/*    color: #d10b11;*/
/*    margin-top: 50px;*/
/*    margin-left: 450px;*/
/*    transform: rotateZ(-30deg);*/
/*    font-size: 28px;*/
/*}*/

/*.think-align-home2{*/
/*    color: #d10b11;*/
/*    margin-top: 120px;*/
/*    margin-left: -60px;*/
/*    transform: rotateZ(-30deg);*/
/*    font-size: 28px;*/
/*}*/




/*.think-align-home3{*/
/*    font-size: 30px;*/
/*    margin-left: 450px;*/
/*    margin-bottom: -110px;*/

.hexa-design2 {
    color: greenyellow;
    display: grid;
    background: #17606f;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hexa-design3 {
    color: greenyellow;
    display: grid;
    background: #d20b12;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hexa-design4 {
    color: greenyellow;
    display: grid;
    background: #d20b12;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hexa-design5 {
    color: greenyellow;
    display: grid;
    background: #002f49;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hexa-design6 {
    color: greenyellow;
    display: grid;
    background: #002f49;
    align-items: center;
    text-align: center;
    align-content: center;
}

.hexa-design7 {
    color: greenyellow;
    display: grid;
    background: #002f49;
    align-items: center;
    text-align: center;
    align-content: center;
}

.error-404-text{
    color: crimson;
    font-weight: 800;
    text-align: center;
}

.bg{
    padding: 2px 6px;
    border-radius: 4px;
}

/*Event*/
.event-main-design-align{
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #ffffff;
}
.event-main-design-align img{
    width: 70px;
}
.date-align{
    background-color: #ffffff;
    position: relative;
    margin: auto;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
}
.event-midle-align{
    padding: 20px; background-color: #efefef;
}
.work-shop-title{
    color: #000000;
}
.register-button-align {
    padding: 43px;
    background-color: #ffffff;
}
.time-align{
    background-color: gold;
    border-radius: 8px;
    padding: 5px;
}

.event-banner-design1 {
    max-width: 800px !important;
    margin-top: -50px;
}
.event-button-design:hover{
    text-decoration: none;
}
.event-button-design{
    text-decoration: none;
    font-size: 20px;
    font-weight: 700;
    background-color: #47b2e4;border-radius: 8px;padding: 5px;
}

/* event gallary css */
body {
    background-color: #eee;
}
.hello {
    opacity: 1 !important;
}
.full {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.full .content {
    background-color: rgba(0,0,0,0.75) !important;
    height: 100%;
    width: 100%;
    display: grid;
}
.full .content img {
    left: 50%;
    transform: translate3d(0, 0, 0);
    animation: zoomin 1s ease;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}
.byebye {
    opacity: 0;
}
.byebye:hover {
    transform: scale(0.2) !important;
}
.gallery {
    display: grid;
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-auto-rows: 8px;
}
.gallery img {
    max-width: 100%;
    border-radius: 8px;
    box-shadow: 0 0 16px #333;
    transition: all 1.5s ease;
}
.gallery img:hover {
    box-shadow: 0 0 32px #333;
}
.gallery .content {
    padding: 4px;
}
.gallery .gallery-item {
    transition: grid-row-start 300ms linear;
    transition: transform 300ms ease;
    transition: all 0.5s ease;
    cursor: pointer;
}
.gallery .gallery-item:hover {
    transform: scale(1.025);
}
@media (max-width: 600px) {
    .gallery {
        grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
    }
}
@media (max-width: 400px) {
    .gallery {
        grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
    }
}
@-moz-keyframes zoomin {
    0% {
        max-width: 50%;
        transform: rotate(-30deg);
        filter: blur(4px);
    }
    30% {
        filter: blur(4px);
        transform: rotate(-80deg);
    }
    70% {
        max-width: 50%;
        transform: rotate(45deg);
    }
    100% {
        max-width: 100%;
        transform: rotate(0deg);
    }
}
@-webkit-keyframes zoomin {
    0% {
        max-width: 50%;
        transform: rotate(-30deg);
        filter: blur(4px);
    }
    30% {
        filter: blur(4px);
        transform: rotate(-80deg);
    }
    70% {
        max-width: 50%;
        transform: rotate(45deg);
    }
    100% {
        max-width: 100%;
        transform: rotate(0deg);
    }
}
@-o-keyframes zoomin {
    0% {
        max-width: 50%;
        transform: rotate(-30deg);
        filter: blur(4px);
    }
    30% {
        filter: blur(4px);
        transform: rotate(-80deg);
    }
    70% {
        max-width: 50%;
        transform: rotate(45deg);
    }
    100% {
        max-width: 100%;
        transform: rotate(0deg);
    }
}
@keyframes zoomin {
    0% {
        max-width: 50%;
        transform: rotate(-30deg);
        filter: blur(4px);
    }
    30% {
        filter: blur(4px);
        transform: rotate(-80deg);
    }
    70% {
        max-width: 50%;
        transform: rotate(45deg);
    }
    100% {
        max-width: 100%;
        transform: rotate(0deg);
    }
  }

