@charset "UTF-8";
html{
	scroll-behavior: smooth;
}
body{
	color:aliceblue;
	background-color: black;
	
}
.introbtn{
	text-align: center;
	margin-bottom: 7%;
}
.introbtn a{

  border-radius: 50px;
  
 background: rgba(161,13,252,0.26); 
  backdrop-filter: blur(12px);
font-size: 2vw;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  padding: 10px 30px;
	text-align: center;
font-family: "Victor Mono", monospace;
color: white;
	text-decoration: none;
	margin-bottom: 8%;

}
#svg{
	animation: fadeIn 1s ease-out forwards;
}

.introbtn a:hover{
	background-image: url("images/button.gif");
	background-size: cover;
	background-position: center;
	color:transparent;
	
}


.maincards{
	
	background-color: transparent;
	text-align: center;
	color:whitesmoke;
	font-family: "Victor Mono", monospace;

}
footer{
	text-align: center;
	font-family: "Jura", sans-serif;
	font-size: 20px;
	background: rgba(73,255,0,0.38); 
  backdrop-filter: blur(12px);
}
.braincard{
	margin-top: 7%
}

.chesscard{
	margin-top: 9%
}

.maincontainer{
	width: 90%
}

.sculpture{
	width: 70%;
	margin: 0 auto;
}

.intro{
padding-top: 3%;
	background-color: black;
	margin-bottom: 3%;
}

.images{
	width: 40%;
	height: 32%;
background:url("images/BCGIF.gif");
	background-size: cover;
position: absolute;
	top: 32%;
	left: 6%;
	border-radius: 25px;
	opacity: 0;

}

.images2{
	width: 15%;
	height: 26.5%;
background:url("images/qr-code.png");
	background-size: cover;
position: absolute;
	top: 65%;
	left: 80%;
	border-radius: 15px;
	opacity: 0;

}
audio{
	position: absolute;
	top: 12%;
	left: 75%;
	width: 20%;
	filter: invert(100%);
	z-index: 6;
}
.images:hover{
  animation: fadeIn 1s ease-out forwards;
	
	
}

.images2:hover{
  animation: fadeIn 1s ease-out forwards;
opacity: 1;
	
}
.brainimg{
	width: 95%;
}
.mainbt{
	background-color:rgba(0, 255, 0, 0.521);
	border-radius: 50px;
	border: none;
}

.mainbt:hover{
	background-color:rgba(162, 0, 255, 0.521);
	border-radius: 50px;
	border: none;
}
.introimg {
	position: relative;
	z-index: 2;
}
.introtext{
	align-content: center;
}
.videosrow{
	display: flex;
	flex-direction: row;
}


.btn-primary{
	background-color: transparent;
	color:  chartreuse;
 font-family: "Jura", sans-serif;
	width: 70%;
	margin: 0 auto;
	border-radius: 50px; 
	border: solid; 
	
}

.btn-primary:hover{
	background-color: rgba(73,255,0,0.58);
	border:none;
}
.modal-content{
background: rgba(255, 255, 255, 0.4); 
  backdrop-filter: blur(12px);

  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
font-family: "Victor Mono", monospace;
color: white;

}

.modaltext{
	text-align: justify;
}

.modaltext h2{
	width:90%;
	margin: 0 auto;
	font-family: "Jura", sans-serif;
}
.modaltext p{
	width:90%;
	margin: 0 auto;
	font-size: 20px;
}

.artist1 h1{
	font-family: "Jura", sans-serif;
	color: #8a45db;
	padding-bottom: 5%;
	padding-top: 5%;
}


.artist2 h1{
	font-family: "Jura", sans-serif;
	color: #ffa7da;
	padding-bottom: 5%;
	padding-top: 5%;
}
.btns{
	margin-bottom: 5%;
}
.artist3 h1{
	font-family: "Jura", sans-serif;
	color: #36A093;
	padding-bottom: 5%;
	padding-top: 5%;
}
.artist4 h1{
	font-family: "Jura", sans-serif;
	color: #74C044;
	padding-bottom: 5%;
	padding-top: 5%;
}

.introtext p{
	width: 80%;

	font-size:23px;
	font-family: "Victor Mono", monospace;
	text-align: justify;
	
	animation: fadeIn 1s ease-in;
}
.chaptermain h3{
font-family: "Victor Mono", monospace;
color:chartreuse;
}
.chaptermain{
	animation: fadeIn 1s ease-in;
}

.introtext a{
	color:chartreuse;
	text-decoration: none;
}

.chaptertext{
	font-family: "Victor Mono", monospace;
	width: 70%;
	text-align: justify;
	font-size: 1.7vw;
	font-weight: 100;
	animation: fadeIn 1s ease-out forwards;
	margin-bottom: 10%;
}

.imggallery{
	width: 80%;
	margin: 0 auto;
	margin-top: 10%;
}

.modal-header{
	bs-modal-header-border-color:transparent;
}

/*/ Navbar settings /*/



.custom-navbar {
  width: 80%;
  margin: 15px auto; 
  border-radius: 50px;
  
  background: rgba(255, 255, 255, 0.1); 
  backdrop-filter: blur(12px);

  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  padding: 10px 20px;
	text-align: center;
}





.custom-navbar .nav-link {
  color: rgba(255,255,255,0.66);
  font-weight: 500;
  transition: 0.3s;
   font-family: "Jura", sans-serif;
}

.dropdown-menu{
	background: rgba(73,255,0,0.58); 
  backdrop-filter: blur(12px);
	border: none;
	color: white
		
}

.dropdown-menu .dropdown-item{
	color:white;
	  font-family: "Jura", sans-serif;

}

.dropdown-item:hover{
	background-color: rgba(73,255,0,0.58);
}

.custom-navbar .nav-link:hover {
  color: chartreuse;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show{
	color: chartreuse;
}
.custom-navbar {
  border: 1px solid rgba(255, 255, 255, 0.185);
  box-shadow: 0px 2px 17px -4px rgba(255,255,255,0.19);}

.custom-navbar.container {
  max-width: 100%;
}


body {
  padding-top: 100px;
}
/*/ Navbar settings /*/


@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


