@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Moon+Dance&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Arvo&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap");

* {
  margin: 0%;
  padding: 0%;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  --bg-color: linear-gradient(to right, "#402571", "#311F65");
  --typeSpeed: 2.5s;
  --textLength: 9;
  --card-height: 65vh;
  --card-width: calc(var(--card-height) / 1.5);
}

*:focus {
  outline: none !important;
}

@font-face {
  font-family: Tigerious;
  src: url("../fonts/TigeriousItalic-9YyJn.otf");
}

@font-face {
  font-family: Wynford;
  src: url("../fonts/WynfordObliqueLineAlt1-4Byx9.otf");
}

@font-face {
  font-family: Hyperhelix;
  src: url("../fonts/HyperHelix-nRR2V.ttf");
}

html {
  scroll-behavior: smooth;
}

.body {
  height: 100vh;
  width: 100%;
  overflow-y: hidden;
}

.lotter-bg {
  width: 100%;
}

html {
  scroll-behavior: smooth;
}

@media only screen and (max-width: 700px) {
  .lottie-bg {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }

  .hidden {
    display: block !important;
  }

  .active {
    display: none !important;
  }
}

.hidden {
  display: none;
}

#preLoader {
  width: 100%;
  height: 100vh;
}

.cp-tag {
  text-decoration: none;
  display: inline-block;
  position: relative;
  opacity: 0.75;
  font-weight: bold;
  font-family: "Orbitron", sans-serif;
}

.cp-tag::before {
  transition: 300ms;
  height: 3px;
  content: "";
  position: absolute;
  background-color: white;
  width: 0%;
  bottom: 20px;
}

.cp-tag:hover::before {
  width: 100%;
}

.cp-tag:hover {
  opacity: 1;
}

.hero-heading {
  color: white;
  font-family: "Tigerious";
}

.heading-title {
  font-family: "Hyperhelix";
  position: relative;
  font-size: 1.25em;
}

.heading-title::before,
.heading-title::after {
  content: "";
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  position: absolute;
}

.heading-title::before {
  background-image: linear-gradient(to right, #4C2E49, #442942);
  animation: animateTyping var(--typeSpeed) steps(var(--textLength)) forwards;
}

.heading-title::after {
  width: 0.125em;
  background: white;
  animation: animateTyping var(--typeSpeed) steps(var(--textLength)) forwards,
    blink 2.5s steps(var(--textLength)) forwards;
}

@keyframes animateTyping {
  to {
    left: 100%;
  }
}

@keyframes blink {
  to {
    background: transparent;
  }
}

/* Navbar-mb*/
.nav-mb {
  position: fixed;
  top: 0;
  z-index: 100;
}

.a-tag {
  text-decoration: none;
  color: #1e1e23;
  opacity: 1;
  font-family: "work sans", sans serif;
  font-size: 1.6em;
  font-weight: 400;
  transition: 200ms;
}

.a-tag:hover {
  opacity: 0.5;
  color: #512e7f;
  text-decoration: none;
}

ul {
  text-align: center;
  padding: 0;
  list-style-type: none;
}

.content {
  border: 1px solid #36383f;
  border-radius: 20px;
  width: 100%;
  height: 91%;
  background-color: #f5f6fa;
}

nav {
  height: 65px;
}

#menuToggle {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 15 !important;
  -webkit-user-select: none;
  user-select: none;
  background: #4A2D48;
  width:100vw;
  height:40px;
}

#menuToggle input {
  display: flex;
  width: 40px;
  height: 32px;
  position: absolute;
  cursor: pointer;
  opacity: 0;
  z-index: 2;
}
#menutitle
{
  margin-top:0; 
  position: absolute; 
  /* left:80px;   */
  display:block;
  width:100vw;
  color: white;
  font-size:1.7em;
  margin-left:auto;
  /* padding: 2px; */
  text-align: center;
}
#menuToggle span {
  display: flex;
  width: 29px;
  height: 3px;
  margin-bottom: 5px;
  position: relative;
  background: white;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 5px 0px;
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
    opacity 0.55s ease;
  background: white;
  top:12px;
  left:20px;
}

#menuToggle span:first-child {
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2) {
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span {
  opacity: 1;
  transform: rotate(45deg) translate(-3px, -1px);
  background: #36383f;
}

#menuToggle input:checked ~ span:nth-last-child(3) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2) {
  transform: rotate(-45deg) translate(0, -1px);
}
input:checked ~ .second{
  transform: rotate(-45deg) translate(0, -1px) !important;
  margin-top:2px;
  margin-right: 2px;
  margin-bottom: 0px;
}
#menu {
  position: absolute;
  width: 400px;
  height: 120vh;
  box-shadow: 0 0 10px #85888c;
  margin: -50px 0 0 -50px;
  padding: 50px;
  padding-top: 125px;
  background-color: #f5f6fa;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
}

#menu li {
  padding: 10px 0;
  transition-delay: 2s;
  
}

#menuToggle input:checked ~ ul {
  transform: none;
  opacity:0.95;
}

.sectionHead {
  font-size: 2em;
  color: black;
  font-family: "Orbitron", sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 5%;
  background-color: transparent;
}
p.uk-text-center  {
   text-align:justify !important;
}
.abt{
margin-top:8vh;
color: white;
text-align:justify;
}

#navbarMain {
  transition: all 0.5s ease-out;
}

.background-xenith {
  background-color:#4A2D48;
  transition: all 0.8s ease-in;
}

.c-white {
  color: white !important;
  transition: all 0.8s ease-in;
}

#pos-rel-1 {
  max-height: 110vh;
  overflow: hidden;
}

#about {
  height: 38vw;
  overflow: hidden;
  padding: 5%;
}

#faqs
{
  min-height: 95vh;
  overflow: hidden;
  padding: 5%; 
}

#event {
  height: 42vw;
  overflow: hidden;
  padding-top: 70px;
}

.event-card {
  height: 40vh;
  margin: 0% 3%;
}

#timeline {
  /* height: 150vh; */
  overflow: hidden;
  /* padding: 5%; */
}

#team {
  height: 90vh;
  overflow: hidden;
 
}
@media only screen and (max-width: 1439px) {
  #about {
    min-height: 60vw;
    overflow: hidden;
  }
}
@media only screen and (max-width: 1000px) {
  #about {
    min-height: 70vh;
    overflow: hidden;
  }

  #event {
    height: 100vh;
    overflow: hidden;
    padding: 5%;
  }

  .event-card {
    height: 100vh;
    margin: 0% 3%;
  }

  #timeline {
    /* height: 170vh; */
    overflow: hidden;
    /* padding: 5%; */
  }

  #team {
    height: 100vh;
    overflow: hidden;
    padding: 5%;
  }
}

#timeline
{
  margin-top:10vh;
}
#team-slider {
  padding: 10% 5%;
  margin-top: 3%;
}

.team-members {
  width: 45vh;
  height: 45vh;
  margin: 3%;
  border-radius: 50%;
}

.team-name {
  font-family: "Moon Dance", cursive;
  font-size: 3em;
  font-weight: bolder;
}

.footer .footer-bottom {
  background: #462A44;
  color: #686868;
  
  width: 95%;
  position: absolute;
  bottom: 0px;
  left: 0px;
  padding-top: 20px;
  margin-bottom: 40px;
}
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-top: 15px;
}
.btn {
  width:35px;
  height: 35px;
  background-color: #fafafa;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 5px;
  margin-right: 10px;
  cursor: pointer;
  transition: all 0.3s;
  border-radius: 10px;
  min-width: 5vh;
  min-height: 5vh;
}
i.fa {
  font-size: 25px;
}
#fb {
  color: #006fff;
  text-shadow: 0 0 20px #006fff;
}
#ig {
  color: #ff5f40;
  text-shadow: 0 0 20px #ff5f40;
}
#ln {
  color: #00acff;
  text-shadow: 0 0 20px #00acff;
}
#yt {
  color: #ff0000;
  text-shadow: 0 0 30px #ff0000;
}
#gt {
  color: #860c0c;
  text-shadow: 0 0 15px #860c0c;
}
#ph {
  color: #16cc34;
  text-shadow: 0 0 15px #16cc34;
}
.btn.ph-btn {
  box-shadow: 0 15px 15px -11px rgba(7, 192, 47, 0.53);
}
.btn.ph-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px rgba(14, 235, 14, 0.65);
}
.btn.fb-btn {
  box-shadow: 0 15px 15px -11px rgba(0, 111, 255, 0.53);
}
.btn.fb-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px rgba(0, 111, 255, 0.65);
}
.btn.ig-btn {
  box-shadow: 0 15px 15px -11px rgba(255, 16, 39, 0.5);
}
.btn.ig-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px rgba(255, 16, 39, 0.57);
}
.btn.gt-btn {
  box-shadow: 0 15px 15px -11px #be1818;
}
.btn.gt-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px #860c0c;
}

.btn.yt-btn {
  box-shadow: 0 15px 15px -11px rgba(255, 47, 47, 0.53);
}
.btn.yt-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px rgba(236, 5, 5, 0.6);
}

.btn.ln-btn {
  box-shadow: 0 15px 15px -11px rgba(0, 255, 255, 0.53);
}
.btn.ln-btn:hover {
  transform: scale(1.2);
  box-shadow: 0 20px 35px -9px rgba(0, 111, 255, 0.6);
}
h1 {
  color: #f5f5f5;
}

@keyframes flicker {
  50% {
    color: white;
    filter: saturate(200%) hue-rotate(20deg);
  }
}

.footer {
  line-height: 1;
  position:relative !important;
  width: 100%;
  background: rgb(59, 35, 108);
  min-height: 100px;
  padding: -5px 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 370px;
  font-family: Georgia, serif !important;
  font-size: 20px;
  bottom: 0;
  margin-top: 300px;
  
}

.social-icon,
.menu {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px 0;
  flex-wrap: wrap;
}

.social-icon__item,
.menu__item {
  list-style: none;
}

.social-icon__link {
  font-size: 2rem;
  color: #fff;
  margin: 0 10px;
  display: inline-block;
  transition: 0.5s;
}
.social-icon__link:hover {
  transform: translateY(-10px);
}

.menu__link {
  font-size: 1.2rem;
  color: #fff;
  margin: 0 10px;
  display: inline-block;
  transition: 0.5s;
  text-decoration: none;
  opacity: 0.75;
  font-weight: 300;
}

.menu__link:hover {
  opacity: 1;
}

.footer p {
  color: #fff;
  margin: 15px 0 10px 0;
  font-size: 1rem;
  font-weight: 300;
}

.wave {
  position: absolute;
  top: -100px;
  left: 0;
  width: 100%;
  height: 100px;
  background: url("wave.png"); /*add css/wave.png instead*/
  background-size: 1000px 100px;
}

.wave#wave1 {
  z-index: 1000;
  opacity: 1;
  bottom: 0;
  animation: animateWaves 4s linear infinite;
}

.wave#wave2 {
  z-index: 999;
  opacity: 0.5;
  bottom: 10px;
  animation: animate 4s linear infinite !important;
}

.wave#wave3 {
  z-index: 1000;
  opacity: 0.2;
  bottom: 15px;
  animation: animateWaves 3s linear infinite;
}

.wave#wave4 {
  z-index: 999;
  opacity: 0.7;
  bottom: 20px;
  animation: animate 3s linear infinite;
}

@keyframes animateWaves {
  0% {
    background-position-x: 1000px;
  }
  100% {
    background-positon-x: 0px;
  }
}

@keyframes animate {
  0% {
    background-position-x: -1000px;
  }
  100% {
    background-positon-x: 0px;
  }
}
/*
.footer .footer-content {
  height: 370px;
  display: flex;
  margin-bottom: 10px;
  justify-content: space-around; 
}
.footer .footer-content .footer-section {
  flex: 1;
  margin-bottom: 10px;
}
.footer .footer-content .about {
  width: 550px;
  margin-left: 10px;
  height: 300px;
}

.footer .footer-content .links {
  width: 350px;
  /* margin-right: 100px; */
/*}*//*
.footer .footer-content .contact-form {
  margin-right: 10px;
  
}
.footer .footer-content h1,
.footer .footer-content h2 {
  color: white;
}

.footer .footer-content   a {
  color: white;
  display: inline-block;
  margin-bottom: 10px;
  font-size: 1.2em;
  transition: all 0.3s;
}
.footer .footer-content h3 {
  color: white;
  font-family: Georgia, serif;
  line-height: 1.5;
  margin-top: 0px;
}

.footer .footer-content  a:hover {
  color: rgb(244, 136, 248);
  margin-left: 15px;
  transition: all 0.3s;
}
*/

@import "compass/css3";
.glitch {
  color: white;
  font-size: 40px;
  position: relative;

  /* width: 400px; */
}
.name{
  margin-bottom: 25px;
}
@keyframes noise-anim {
  0% {
    clip: rect(1px, 9999px, 1px, 0);
  }
  5% {
    clip: rect(5px, 9999px, 9px, 0);
  }
  10% {
    clip: rect(15px, 9999px, 23px, 0);
  }
  15% {
    clip: rect(22px, 9999px, 8px, 0);
  }
  20% {
    clip: rect(25px, 9999px, 19px, 0);
  }
  25% {
    clip: rect(11px, 9999px, 25px, 0);
  }
  30% {
    clip: rect(17px, 9999px, 4px, 0);
  }
  35% {
    clip: rect(19px, 9999px, 8px, 0);
  }
  40% {
    clip: rect(26px, 9999px, 26px, 0);
  }
  45% {
    clip: rect(30px, 9999px, 29px, 0);
  }
  50% {
    clip: rect(25px, 9999px, 28px, 0);
  }
  55% {
    clip: rect(13px, 9999px, 1px, 0);
  }
  60% {
    clip: rect(3px, 9999px, 7px, 0);
  }
  65% {
    clip: rect(14px, 9999px, 20px, 0);
  }
  70% {
    clip: rect(8px, 9999px, 29px, 0);
  }
  75% {
    clip: rect(21px, 9999px, 8px, 0);
  }
  80% {
    clip: rect(22px, 9999px, 10px, 0);
  }
  85% {
    clip: rect(6px, 9999px, 8px, 0);
  }
  90% {
    clip: rect(17px, 9999px, 15px, 0);
  }
  95% {
    clip: rect(8px, 9999px, 21px, 0);
  }
  100% {
    clip: rect(13px, 9999px, 27px, 0);
  }
}
.glitch:after {
  content: attr(data-text);
  position: absolute;
  left: 2px;
  text-shadow: -1px 0 red;
  top: 0;
  color: white;
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  animation: noise-anim 2s infinite linear alternate-reverse;
}
@keyframes noise-anim-2 {
  0% {
    clip: rect(23px, 9999px, 27px, 0);
  }
  5% {
    clip: rect(14px, 9999px, 21px, 0);
  }
  10% {
    clip: rect(9px, 9999px, 19px, 0);
  }
  15% {
    clip: rect(24px, 9999px, 1px, 0);
  }
  20% {
    clip: rect(4px, 9999px, 25px, 0);
  }
  25% {
    clip: rect(11px, 9999px, 4px, 0);
  }
  30% {
    clip: rect(13px, 9999px, 6px, 0);
  }
  35% {
    clip: rect(15px, 9999px, 9px, 0);
  }
  40% {
    clip: rect(24px, 9999px, 20px, 0);
  }
  45% {
    clip: rect(10px, 9999px, 15px, 0);
  }
  50% {
    clip: rect(3px, 9999px, 1px, 0);
  }
  55% {
    clip: rect(1px, 9999px, 22px, 0);
  }
  60% {
    clip: rect(29px, 9999px, 20px, 0);
  }
  65% {
    clip: rect(3px, 9999px, 3px, 0);
  }
  70% {
    clip: rect(23px, 9999px, 4px, 0);
  }
  75% {
    clip: rect(28px, 9999px, 26px, 0);
  }
  80% {
    clip: rect(28px, 9999px, 21px, 0);
  }
  85% {
    clip: rect(7px, 9999px, 1px, 0);
  }
  90% {
    clip: rect(4px, 9999px, 9px, 0);
  }
  95% {
    clip: rect(11px, 9999px, 16px, 0);
  }
  100% {
    clip: rect(3px, 9999px, 18px, 0);
  }
}
.glitch:before {
  content: attr(data-text);
  position: absolute;
  left: -2px;
  text-shadow: 1px 0 blue;
  top: 0;
  color: white;
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  animation: noise-anim-2 3s infinite linear alternate-reverse;
}
.foot-follow {
  position: relative;
  margin: auto;
  width: 350px;
}

.footer-list {
  padding-left: 30px;
  text-align: justify;
  list-style-type: disc;
}
.uk-position-center{
  width: 78%;
}
#universe{
  height:72vh;
  width: 100%;
}
@media only screen and (max-width: 1200px) {
  .footer .footer-content h3
  {
    font-size: 1.4rem !important;
  }
  .footer .footer-content .links {
    width:0px;
    /* margin-right: 100px; */
  }
  #event
  {
    height:60vw;
  }
  
}
.uk-card-body p {
  font-size: 1.2em;
  font-family: "Arvo", serif;
}
@media only screen and (max-width: 900px) {
  .footer
  {
    height: 1000px;
  }
  .footer .footer-content
  {
    flex-direction: column;
    /* margin-left:35%; */
  }
  .footer .footer-content .links
  {
    width:auto;
  }
  .footer .footer-bottom 
  {
    width: 100%;
    
  }
  .footer .footer-content .about
  {
    width:auto;
  }
  .name{
    /* padding: 0px 82px 30px; */
  }
  #universe
  {
    
    height:101vh;
  }
  #event
  {
    height: 113vh;
  }
}

@media only screen and (max-width: 400px) {
.image-card {
  width: 90vw !important;;
  height:350px!important;
  border-radius: var(--radius);
  position: relative;
  background-size: cover !important;
  /* background-repeat: no-repeat; */
  margin:0px !important;
}
#universe{
  height:150vh;
}
.footer
{
  height: 1100px;
}
/* .timeline p 
{
  padding: 20px !important;
} */
}


.contentfooter a{
  display:inline-block;

}

:root {
  --size: 350px;
  --radius: calc(var(--size) * 20 / 100);
}

.largeFont {
  font-size: 30px;
  font-weight: bold;
}


main {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
 
  width: 100%;
  margin: auto;
  overflow: visible;
}
.teamh {
  
  height:auto!important;
}
.image-card {
  width: var(--size);
  height: var(--size);
  border-radius: var(--radius);
  position: relative;
  background-size: cover;
  margin: calc(var(--size) * 20 / 100);
  border:5px solid white;

  
}
.image-card:before {

  content: "";
  position: absolute;
  top:90%;
  width: 90%;
  height: 20%;
  background-image: inherit;
  background-size: cover;
  border-radius: var(--radius);
  z-index:-1;
  filter: blur(12px);
  opacity: 0;
  left: 50%;
  transform: translate(-50%, 10%);
}
/* .image-card:hover .content {
  transform: perspective(50px) translateZ(2px);
} */
.caption
{
  
  background-color: rgb(41, 39, 39,0.5);
  top: 79%;
  width: 100%;
  height: 21%;
  position: absolute;
  border-radius: 0px 0px var(--radius) var(--radius); 
  
}
.content {
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
  color: white;
  background: none;
  height: 50px;
  /* margin-top: 200px; */
  border: none;
  text-align: center;
  top: 58%;
 
 
 
}
.content h2 {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 display: inline;
  color: white;
  font-size: 25px;
}
.content h3 {
  font-size: 20px;

  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  display: inline;
   color: white;
   margin-top:0px;

 }

 /* .final{
   
   padding: 0px 0px 0px 0px;
   
 }
 .final:before{
 
 }
 .final:after{
  
 }
  */
 * {
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.card {
  transform-style: preserve-3d;
}
.dcard {
  position: relative;
  display: block;
  perspective: 500px;
}
.col-md-12, .col-md-4 {
  margin-top:10vh;
  height: var(--size);
}
.col-md-12 .dcard {
  perspective: 3000px;
}

.trigger {
  position: absolute;
  height: 33.333333%;
  width: 33.333333%;
  display: block;
  z-index: 2;
}
.trigger:nth-child(1) {
  left: 0%;
  top: 0%;
}
.trigger:nth-child(1):hover ~ .card {
  transform: rotateY(8deg) rotateX(-5deg);
}
.trigger:nth-child(2) {
  left: 33.333333%;
  top: 0%;
}
.trigger:nth-child(2):hover ~ .card {
  transform: rotateY(0deg) rotateX(-5deg);
}
.trigger:nth-child(3) {
  left: 66.666666%;
  top: 0%;
}
.trigger:nth-child(3):hover ~ .card {
  transform: rotateY(-8deg) rotateX(-5deg);
}
.trigger:nth-child(4) {
  left: 0%;
  top: 33.333333%;
}
.trigger:nth-child(4):hover ~ .card {
  transform: rotateY(8deg);
}
.trigger:nth-child(5) {
  left: 33.333333%;
  top: 33.333333%;
}
.trigger:nth-child(5):hover ~ .card {
  transform: rotateY(0deg) rotateX(0deg);
}
.trigger:nth-child(6) {
  left: 66.666666%;
  top: 33.333333%;
}
.trigger:nth-child(6):hover ~ .card {
  transform: rotateY(-8deg) rotateX(0deg);
}
.trigger:nth-child(7) {
  left: 0%;
  top: 66.666666%;
}
.trigger:nth-child(7):hover ~ .card {
  transform: rotateY(8deg) rotateX(5deg);
}
.trigger:nth-child(8) {
  left: 33.333333%;
  top: 66.666666%;
}
.trigger:nth-child(8):hover ~ .card {
  transform: rotateY(0deg) rotateX(5deg);
}
.trigger:nth-child(9) {
  left: 66.666666%;
  top: 66.666666%;
}
.trigger:nth-child(9):hover ~ .card {
  transform: rotateY(-8deg) rotateX(5deg);
}
.dcard:hover .content {
  transform: perspective(50px) translateZ(2px);
}
 
.uk-position-top-center {
  top:0px!important;
}
/* .image-card:hover .content {
  transform: perspective(50px) translateZ(2px);
} */

@media (min-width: 960px){
.uk-section {
     padding-top: 0px; 
     padding-bottom: 0px;
}}
 

/*Events*/
@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,500,600,700,800');
 * {
	 box-sizing: border-box;
}
:root{
--pcolor: #b4138c;
--bg: linear-gradient(to bottom, #270991, #18aab4);
 --bgxmas: linear-gradient(to bottom, #4b0935, #dd27d4);
--shadowgreen: box-shadow: -4px 8px 71px 24px rgba(30,147,56,0.51);
-webkit-box-shadow: -4px 8px 71px 24px rgba(26, 230, 230, 0.51);
-moz-box-shadow: -4px 8px 71px 24px rgba(29, 168, 211, 0.51);

}
body{
  margin:0;
}
.full{
  display:flex;
  justify-content:center;
  height:757px;
  padding: 30px;
  margin-top: 5vh;
  
}
 .blog-slider {
	 width: 95%;
	 position: relative;
	 max-width: 800px;
   display:flex;
   justify-content:center;
   align-items:center;
	 margin:8vh;
	 background: #fff;
   box-shadow: var(--shadowgreen);
	 border-radius: 1em;
	 height: 65%;
	 transition: all 0.3s;
   margin-left: 15vw;
}
 @media screen and (max-width: 992px) {
	 .blog-slider {
		 max-width: 680px;
		 height: 400px;
	}
}
 @media screen and (max-width: 768px) {
	 .blog-slider {
		 min-height: 500px;
		 height: auto;
		 margin: 180px auto;
     width: 87vw;
	}
  .blog-slider__item{
    width: 280px;
  }
  
  
}
 @media screen and (max-height: 500px) and (min-width: 992px) {
	 .blog-slider {
		 height: 350px;
	}
}
 .blog-slider__item {
	 display: flex;
	 align-items: center;
}
 @media screen and (max-width: 768px) {
	 .blog-slider__item {
		 flex-direction: column;
	}
}
 .blog-slider__item.swiper-slide-active .blog-slider__img img {
	 opacity: 1;
	 transition-delay: 0.2s;
}
 .blog-slider__item.swiper-slide-active .blog-slider__content > * {
	 opacity: 1;
	 transform: none;
}
 .blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(1) {
	 transition-delay: 0.3s;
}
 .blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(2) {
	 transition-delay: 0.4s;
}
 .blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(3) {
	 transition-delay: 0.5s;
}
 .blog-slider__img {
	 width: 300px;
	 flex-shrink: 0;
	 height: 300px;
	 background: var(--bgxmas);
	 box-shadow: var(--shadowgreen);
	 border-radius: 1em;
	 transform: translateX(-80px);
	 overflow: hidden;
}
 .blog-slider__img:after {
	 content: '';
	 position: absolute;
	 top: 0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 background: var(--bg);
	 border-radius: 1em;
	 opacity: 0.2;
}
 .blog-slider__img img {
	 width: 100%;
	 height: 100%;
	 object-fit: cover;
	 display: block;
	 opacity: 0;
	 border-radius: 1em;
	 transition: all 0.3s;
}
 @media screen and (max-width: 768px) {
	 .blog-slider__img {
		 transform: translateY(-50%);
		 width: 90%;
	}
}
 @media screen and (max-width: 576px) {
	 .blog-slider__img {
		 width: 95%;
    
	}
}
 @media screen and (max-height: 500px) and (min-width: 992px) {
	 .blog-slider__img {
		 height: 270px;
	}
}
 .blog-slider__content {
	 padding-right: 25px;
}
 @media screen and (max-width: 768px) {
	 .blog-slider__content {
		 margin-top: -80px;
		 text-align: center;
		 padding: 0 30px;
	}
  
}
 @media screen and (max-width: 576px) {
	 .blog-slider__content {
		 padding: 0;
	}
}
 .blog-slider__content > * {
	 opacity: 0;
	 transform: translateY(25px);
	 transition: all 0.4s;
}
 .blog-slider__code {
	 color: #7b7992;
	 margin-bottom: 15px;
	 display: block;
	 font-weight: 500;
}
 .blog-slider__title {
	 font-size: 24px;
	 font-weight: 700;
	 color: #0d0925;
	 margin-bottom: 20px;
}
 .blog-slider__text {
	 color: #4e4a67;
	 margin-bottom: 30px;
	 line-height: 1.5em;
}
 .blog-slider__button {
	 display: inline-flex;
	 background:var(--pcolor);
	 padding: 15px 35px;
	 border-radius: 50px;
	 color: #fff;
	 box-shadow: 0px 14px 80px rgba(252, 56, 56, 0.4);
	 text-decoration: none;
	 font-weight: 500;
	 justify-content: center;
	 text-align: center;
	 letter-spacing: 1px;
}
 @media screen and (max-width: 576px) {
	 .blog-slider__button {
		 width: 100%;
	}
  
}
 .blog-slider .swiper-container-horizontal > .swiper-pagination-bullets, .blog-slider .swiper-pagination-custom, .blog-slider .swiper-pagination-fraction {
	 bottom: 10px;
	 left: 0;
	 width: 100%;
}
 .blog-slider__pagination {
	 position: absolute;
	 z-index: 21;
	 right: 20px;
	 width: 11px !important;
	 text-align: center;
	 left: auto !important;
	 top: 50%;
	 bottom: auto !important;
	 transform: translateY(-50%);
}
 @media screen and (max-width: 768px) {
	 .blog-slider__pagination {
		 transform: translateX(-50%);
		 left: 50% !important;
		 top: 205px;
		 width: 100% !important;
		 display: flex;
		 justify-content: center;
		 align-items: center;
	}
}
 .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
	 margin: 8px 0;
}
 @media screen and (max-width: 321px) {
	 .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
		 margin: 0 5px;
	}
  .blog-slider__img {
   
    height: 218px;
   

  }

  .blog-slider__pagination {
    
    top: 20vh;
  }
  #universe {
    padding-top: 3vh;
  }
  .blog-slider {
    width: 135%;
  }
}
 .blog-slider__pagination .swiper-pagination-bullet {
	 width: 11px;
	 height: 11px;
	 display: block;
	 border-radius: 10px;
	 background: #062744;
	 opacity: 0.2;
	 transition: all 0.3s;
}
 .blog-slider__pagination .swiper-pagination-bullet-active {
	 opacity: 1;
	 background: var(--pcolor);
	 height: 30px;
	 box-shadow: 0px 0px 20px rgba(252, 56, 56, 0.3);
}
 @media screen and (max-width: 768px) {
	 .blog-slider__pagination .swiper-pagination-bullet-active {
		 height: 11px;
		 width: 30px;
	}
}
 /*ff*/
 @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,500,300,700);



section {
  width: 100%;
  display: inline-block;
  background: #333;
  height: 50vh;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  text-decoration: underline;
}

.footer-distributed{
	  background: #462A44;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	width: 100%;
	text-align: left;
  font: normal 16px 'Open Sans', cursive;
	padding: 25px 20px ;
  margin-top: 300px;
}

.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
	display: inline-block;
	vertical-align: top;
}

/* Footer left */

.footer-distributed .footer-left{
	width: 20%;
}

/* The company logo */

.footer-distributed h3{
	color:  #ffffff;
	font: normal 36px 'Open Sans', cursive;
	margin: 0;
}

.footer-distributed h3 span{
	color:  lightseagreen;
}

/* Footer links */

.footer-distributed .footer-links{
	color:  #ffffff;
	margin: 20px 0 12px;
	padding: 0;
}

.footer-distributed .footer-links a{
	display:inline-block;
	line-height: 1.8;
  font-weight:400;
	text-decoration: none;
	color:  inherit;
}

.footer-distributed .footer-company-name{
	color:  #222;
	font-size: 14px;
	font-weight: normal;
	margin: 0;
}

/* Footer Center */

.footer-distributed .footer-center{
	width: 50%;
}

.footer-distributed .footer-center i{
	color: #ffffff;
	font-size: 25px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	text-align: center;
	line-height: 42px;
	/* margin: 10px 15px; */
	vertical-align: middle;
}



.footer-distributed .footer-center p{
	display: inline-block;
	color: #ffffff;
  font-weight:400;
	vertical-align: middle;
	margin:0;
  line-height:2;
}

.footer-distributed .footer-center p span{
	display:block;
	font-weight: normal;
	font-size:14px;
	line-height:2;
}

.footer-distributed .footer-center p a{
	color:  lightseagreen;
	text-decoration: none;;
}

.footer-distributed .footer-links a:before {
  content: "|";
  font-weight:300;
  font-size: 20px;
  left: 0;
  color: #fff;
  display: inline-block;
  padding-right: 5px;
}

.footer-distributed .footer-links .link-1:before {
  content: none;
}

/* Footer Right */

.footer-distributed .footer-right{
	width: 25%;
}

.footer-distributed .footer-company-about{
	line-height: 20px;
	color:  #92999f;
	font-size: 13px;
	font-weight: normal;
	margin: 0;
}

.footer-distributed .footer-company-about span{
	display: block;
	color:  #ffffff;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 20px;
}


/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {

	.footer-distributed{
		font: bold 14px sans-serif;
	}

	.footer-distributed .footer-left,
	.footer-distributed .footer-center,
	.footer-distributed .footer-right{
		display: block;
		width: 100%;
		margin-bottom: 40px;
		text-align: center;
	}
  .footer-center
  {
    width: 45% !important;
    margin:auto;
  }
	.footer-distributed .footer-center i{
		margin-left: 0;
	}

}
@media (max-width: 550px)
 {
  .footer-center
  {
    width: 60% !important;
    margin:auto;
  }

  :root {
    --size: 300px;
  }
}
@media (max-width: 410px)
 {
  .footer-center
  {
    width: 100% !important;
    margin:auto;
  }

  :root {
    --size: 290px;
  }
}
#event{
  padding-left: 0px;
  padding-right: 0px;

}
.footer-distributed   a {
  color: white;
  display: inline-block;
  margin-bottom: 10px;
  font-size: 1.2em;
  transition: all 0.3s;
}
.footer-distributed   a:hover {
  color: rgb(244, 136, 248);
  margin-left: 15px;
  transition: all 0.3s;
}

/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.time
{
  max-width:100%;
  padding: 0px;
}
.timeline
{
  margin-top: 15vh;
  font: normal 16px/1.5 "Helvetica Neue", sans-serif;
  color: #fff;
  padding-bottom: 15px;
}


.timeline ul li {
  list-style-type: none;
  position: relative;
  width: 6px;
  margin: 0 auto;
  /*padding-top: 50px;*/
  background: #fff;
}

.timeline ul li::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: inherit;
  z-index: 1;
}

.timeline ul li div {
  position: relative;
  bottom: 0;
  width: 400px;
  padding: 15px;
  /* background: #f45b69; */
}

.timeline ul li div::before {
  content: "";
  position: absolute;
  bottom: 7px;
  width: 0;
  height: 0;
  border-style: solid;
}

.timeline ul li:nth-child(odd) div {
  left: 45px;
}

.timeline ul li:nth-child(odd) div::before {
  left: -17px;
  border-width: 8px 16px 8px 0;
  border-color: transparent #172b4d transparent transparent;
}

.timeline ul li:nth-child(even) div {
  left: -439px;
}

.timeline ul li:nth-child(even) div::before {
  right: -17px;
  border-width: 8px 0 8px 16px;
  border-color: transparent transparent transparent #172b4d;
}

time {
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 8px;
}


/* EFFECTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline ul li::after {
  transition: background 0.5s ease-in-out;
}

.timeline ul li.in-view::after {
  background: #172b4d;
}

.timeline ul li div {
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.timeline ul li:nth-child(odd) div {
  transform: translate3d(200px, 0, 0);
}

.timeline ul li:nth-child(even) div {
  transform: translate3d(-200px, 0, 0);
}

.timeline ul li.in-view div {
  transform: none;
  visibility: visible;
  opacity: 1;
}


/* GENERAL MEDIA QUERIES
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media screen and (max-width: 900px) {
  .timeline ul li div {
    width: 250px;
  }
  .timeline ul li:nth-child(even) div {
    left: -289px;
    /*250+45-6*/
  }
}

@media screen and (max-width: 600px) {
  .timeline ul li {
    margin-left: 20px;
  }
  .timeline ul li div {
    width: calc(100vw - 91px);
  }
  .timeline ul li:nth-child(even) div {
    left: 45px;
  }
  .timeline ul li:nth-child(even) div::before {
    left: -17px;
    border-width: 8px 16px 8px 0;
    border-color: transparent #172b4d transparent transparent;
  }
}


/* EXTRA/CLIP PATH STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline-clippy ul li::after {
  width: 40px;
  height: 40px;
  border-radius: 0;
}

.timeline-rhombus ul li::after {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.timeline-rhombus ul li div::before {
  bottom: 12px;
}

.timeline-star ul li::after {
  clip-path: polygon(
    50% 0%,
    61% 35%,
    98% 35%,
    68% 57%,
    79% 91%,
    50% 70%,
    21% 91%,
    32% 57%,
    2% 35%,
    39% 35%
  );
}

.timeline-heptagon ul li::after {
  clip-path: polygon(
    50% 0%,
    90% 20%,
    100% 60%,
    75% 100%,
    25% 100%,
    0% 60%,
    10% 20%
  );
}

.timeline-infinite ul li::after {
  animation: scaleAnimation 2s infinite;
}

@keyframes scaleAnimation {
  0% {
    transform: translateX(-50%) scale(1);
  }
  50% {
    transform: translateX(-50%) scale(1.25);
  }
  100% {
    transform: translateX(-50%) scale(1);
  }
}




@media screen and (max-width: 600px) {
  .parallax {
    background-size: 300% 100%;
    /*opacity: 0.8;*/
  
  }

}

.timeline-card {
  display: inline-block;
  position: relative;
  width: 220px;
  height: 300px;
  word-wrap: break-word;
  border: 0.0625rem solid rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  background-color: #fff;
  background-clip: border-box;
  box-shadow: 0 0 2rem 0 white;
  
}

.card-lift--hover:hover {
  transition: all 0.15s ease;
  transform: translateY(-20px);
  box-shadow: 0 0 2rem 0 gold;
  cursor: pointer;
}

.cover-bg {
  background: transparent;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.timeline-card .card-blockquote {
  position: relative;
  padding: 1rem;
}

.mask {
  /*position: absolute;*/
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.15s ease;
  border-radius: 10px;
}

.opacity-7 {
  opacity: 0.7;
}

.bg-gradient-default {
  background: linear-gradient(87deg, #172b4d 0, #1a174d 100%);
}

.rounded-circle {
  border-radius: 50%;
}

.mt-sm {
  margin-top: 2rem;
}

.mb-sm {
  margin-bottom: 2rem;
}

.icon {
  width: 2rem;
  height: 2rem;
}

.icon i,
.icon svg {
  font-size: 1.7rem;
}

.icon-shape {
  display: inline-flex;
  padding: 12px;
  text-align: center;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}

.icon-shape i,
.icon-shape svg {
  font-size: 1.25rem;
}

.icon-shadow {
  box-shadow: 0 0 2rem 0 white;
}

.icon-color {
  color: white;
}

.text-white {
  color: #fff;
}

.text-center {
  text-align: center;
}

.font-weight-bold {
  font-weight: 600;
}

.border-bottom {
  border-bottom: 0.0625rem solid #e9ecef;
}
.timeline ul li.in-view div {

  background: #191b3f;
}
.sponsor-card {
  position: relative;
  display: flex;  
  justify-content: center;
  align-items: center;
  padding: 42px 0;
  flex-wrap: wrap;
}
 @media screen and (max-width: 410px) {
  .sponsor-card{
    width:100vw;

  }
  
  
}


.sponsor-card .container {
  position: relative;
  width: 320px;
  height: 400px;
  color: #000;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 30px;
  transition: 0.5s;
  border-radius: 10%;

  
}

.sponsor-card .container:hover {
  transform: translateY(-20px);
}

.sponsor-card .container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10%;
  background: linear-gradient(45deg, #C33764, #1D2671);
}

.sponsor-card .container::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10%;

  filter: blur(30px)
}

.sponsor-card .container span {
  position: absolute;
  align-self: baseline;
  margin-top: 20px;
  text-align: center;
  font-weight: bold;
  color: #fff;
  font-size: 1.5rem;
  z-index: 2;
}

.sponsor-card .container h1 {
  position: absolute;
  align-self: flex-end;
  background: transparent;
  z-index: 2;
  font-size: 1.5rem;
  font-weight: bolder;
  text-align: center;
}

.sponsor-card .container img {
  position: absolute;
  align-self: center;
  background: transparent;
  z-index: 2;
}
.temp {
 padding: 0px;
  
}
.uk-tile{
  padding: 0px;
}
@media only screen and (max-width: 700px) {
  .heading-title {
    font-size: 1em;
  }
  .hidden-mb{
    display: none;
  }
  #about {
    height:168vh !important;
    overflow: hidden;
  }

  #event {
    height: 120vh;
    overflow: hidden;
    padding: 5%;
  }

  #team {
    height: 100vh;
    overflow: hidden;
    padding: 5%;
  }

  .event-card {
    height: 100vh;
    margin: 0% 3%;
  }

  #timeline {
    /* min-height: 188vh; */
    overflow: hidden;
    /* padding: 5%; */
  }
  

}
@media only screen and (max-width: 430px) {
  #about {
    height:180vw !important;
    overflow: hidden;
  }
  .full
  {
    margin-top: 5vh;
  }
  .abt
  {
    margin-top: 14vw;
  }
  .col-md-4
  {
    margin-top: 5vh;
  }
}

@media only screen and (max-width: 400px){
  #about {
    height:205vw !important;
    overflow: hidden;
  }
  .abt
  {
    margin-top: 7vh;
  }
  .sectionHead
  {
    line-height: 1.1;
  }
#event {
    height: 200vw;
}
.final{
  margin-bottom: 1px;
}
.col-md-4
  {
    margin-top: 15vh;
  }
  #universe {
    height:200vw;
}
#timeline
{
  margin-top: 5vh;
}
}
@media only screen and (max-width: 375px) {
  #about {
    height:240vw !important;
    overflow: hidden;
  }
}
@media only screen and (max-width: 355px) {
  #about {
    height:260vw !important;
    overflow: hidden;
  }
}
@media only screen and (max-width: 340px) {
  #about {
    height:160vh !important;
    overflow: hidden;
  }
  .full
  {
    margin-top: 0;
  }
  .heading-title {
    font-size: 0.8em ;
}
.abt
{
  margin-top:7vh;
}
#event
{
  height:240vw;
}
}

.parallax {
  background: url('../src/post/Digita.png') repeat fixed 100%;
  background-size: 150% 100%;
  z-index: 999;

}
@media  screen and (min-width:400px) and (max-width:550px) 
{
  .content
  {
    top:54%;
  }
}
  
@media only screen and (max-width: 310px) {
  #about {
    height:180vh!important;
    overflow: hidden;
  }
}
@media  screen and (min-height:700px) and (max-width:1200px) and (min-width:700px) 
{
  .uk-position-center {
    top: calc(35% - var(--uk-position-margin-offset));
}
}
.wow {
  opacity: 0;
  -webkit-transform: translate(0,50px);
  -moz-transform: translate(0,50px);
  -ms-transform: translate(0,50px);
  transform: translate(0,50px);
  -webkit-transition: opacity 1s .1s,transform .1s ease;
  transition: opacity 1s .1s,transform 0.1s ease;
  transition-delay: 0ms;
}

.wow-in-view {
  opacity: 1!important;
  -webkit-transform: translate(0,0)!important;
  -moz-transform: translate(0,0)!important;
  -ms-transform: translate(0,0)!important;
  transform: translate(0,0)!important;
}
@media  screen and (max-width:760px)
{
  .parallax {
   
    background-size: 350% 100%;
    z-index: 999;
  
  }

}

#menutitle{
  color:white;
  font-family: 'Merienda', cursive;
  animation-name:glow;
  animation-duration:1s;
  animation-iteration-count:infinite;
  animation-direction:alternate;
}

@keyframes glow{
  from{text-shadow:0px 0px 5px #fff,0px 0px 5px #614ad3;}
  to{text-shadow:0px 0px 20px #fff,0px 0px 20px #614ad3;}
}
